Не функционирует код javascript используя socket.io

Только он относящийся код в socket.io работает, чат функционирует совершенно, но код, который у меня есть в bootstrapPage.js, не функционирует: почему?. (РАНЬШЕ ФОРМУЛЯРЫ, КЛИКНУВ В SIGN IN И LOGIN, РАБОТАЛИ, СЕЙЧАС УЖЕ НЕ) introducir la descripción de la imagen aquí introducir la descripción de la imagen aquí

index.html

<html>
   <head>
      <title>Bootstrap Case</title>
      <meta charset="utf-8">
      <meta name="viewport" content="width=device-width, initial-scale=1">
      <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
      <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
      <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
      <script src="https://cdn.socket.io/socket.io-1.2.0.js"></script>
      <script src="http://code.jquery.com/jquery-1.11.1.js"></script>

      <style>
         form { background: #000; padding: 3px; position: fixed; bottom: 0; width: 100%; }
         form input { border: 0; padding: 10px; width: 90%; margin-right: .5%; }
         form button { width: 9%; background: rgb(130, 224, 255); border: none; padding: 10px; }
         #messages { list-style-type: none; margin: 0; padding: 0; }
         #messages li { padding: 5px 10px; }
         #messages li:nth-child(odd) { background: #eee; }
      </style>

   </head>

   <body>
      <nav class="navbar navbar-default">
         <div class="container-fluid">
            <div class="navbar-header">
               <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1" aria-expanded="false">
               <span class="sr-only">Toggle navigation</span>
               <span class="icon-bar"></span>
               <span class="icon-bar"></span>
               <span class="icon-bar"></span>
               </button>
               <a class="navbar-brand" href="#">MyApp <span class="glyphicon glyphicon-heart" style="color:red;"></span>
               </a>
            </div>

            <div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
               <ul class="nav navbar-nav">
               <li><a href="#">Chat</a></li>
               <ul class="nav navbar-nav navbar-right">
                  <li><a href="#" id="signUp"><span class="glyphicon glyphicon-user"></span> Sign Up</a></li>
                  <li><a href="#" id="logIn"><span class="glyphicon glyphicon-log-in"></span> Login</a></li>
               </ul>
            </div>
          </div>

      </nav>
      <div class="container" id="wrap">
      </div>

      <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
      <script src="bootstrapPage.js"></script>

      <div class="container" id="contenido">
         <ul id="messages"></ul>
         <form action="">
            <input id="m" autocomplete="off" /><button>Send</button>
         </form>
      </div>

      <script>
         var socket = io();
         $('form').submit(function(){
           socket.emit('chat message', $('#m').val());
           $('#m').val('');
           return false;
         });
         socket.on('chat message', function(msg){
           $('#messages').append($('<li>').text(msg));
         });
      </script>

   </body>
</html>

index.js

var app = require('express')();
var http = require('http').Server(app);
var io = require('socket.io')(http);

app.get('/', function(req, res){
  res.sendFile(__dirname + '/index.html');
});

io.on('connection', function(socket){
  socket.on('chat message', function(msg){
    io.emit('chat message', msg);
  });
});

http.listen(3000, function(){
  console.log('listening on *:3000');
});

bootstrapPage.js (НЕ ФУНКЦИОНИРУЕТ КОД ВНУТРИ bootstrapPage.js)

$(document).ready(function() {

$( "#signUp" ).on( "click", function(e) {  
  e.preventDefault();
 $("#wrap").load("bootstrapSignUp.html"); 
});

$( "#logIn" ).on( "click", function(e) {
  e.preventDefault();
 $("#wrap").load("bootStrapLogIn.html");

});



window.onload = function() {
 alert("Welcome to myApp");        // ESTE CÓDIGO TAMPOCO SE EJECUTA !!!!!!!
};





});

bootStrapLogIn.html

<div class="container">
<div id="loginbox" style="margin-top:50px;" class="mainbox col-md-6 col-md-offset-3 col-sm-8 col-sm-offset-2">
   <div class="panel panel-info" >
      <div class="panel-heading">
         <div class="panel-title">Sign In</div>
         <div style="float:right; font-size: 80%; position: relative; top:-10px"><a href="#">Forgot password?</a></div>
      </div>
      <div style="padding-top:30px" class="panel-body" >
         <div style="display:none" id="login-alert" class="alert alert-danger col-sm-12"></div>
         <form id="loginform" class="form-horizontal" role="form">
            <div style="margin-bottom: 25px" class="input-group">
               <span class="input-group-addon"><i class="glyphicon glyphicon-user"></i></span>
               <input id="login-username" type="text" class="form-control" name="username" value="" placeholder="username or email">                                        
            </div>
            <div style="margin-bottom: 25px" class="input-group">
               <span class="input-group-addon"><i class="glyphicon glyphicon-lock"></i></span>
               <input id="login-password" type="password" class="form-control" name="password" placeholder="password">
            </div>
            <div class="input-group">
               <div class="checkbox">
                  <label>
                  <input id="login-remember" type="checkbox" name="remember" value="1"> Remember me
                  </label>
               </div>
            </div>
            <div style="margin-top:10px" class="form-group">
               <!-- Button -->
               <div class="col-sm-12 controls">
                  <a id="btn-login" href="#" class="btn btn-success">Login  </a>
                  <a id="btn-fblogin" href="#" class="btn btn-primary">Login with Facebook</a>
               </div>
            </div>
            <div class="form-group">
               <div class="col-md-12 control">
                  <div style="border-top: 1px solid#888; padding-top:15px; font-size:85%" >
                     Don't have an account! 
                     <a href="#" onClick="$('#loginbox').hide(); $('#signupbox').show()">
                     Sign Up Here
                     </a>
                  </div>
               </div>
            </div>
         </form>
      </div>
   </div>
</div>
<div id="signupbox" style="display:none; margin-top:50px" class="mainbox col-md-6 col-md-offset-3 col-sm-8 col-sm-offset-2">
<div class="panel panel-info">

bootstrapSignUp.html

<div class="row">
        <div class="col-md-6 col-md-offset-3">
            <form action="r" method="post" accept-charset="utf-8" class="form" role="form">   <legend>Sign Up</legend>
                    <h4>It's free and always will be.</h4>
                    <div class="row">
                        <div class="col-xs-6 col-md-6">
                            <input type="text" name="firstname" value="" class="form-control input-lg" placeholder="First Name"  />                        </div>
                        <div class="col-xs-6 col-md-6">
                            <input type="text" name="lastname" value="" class="form-control input-lg" placeholder="Last Name"  />                        </div>
                    </div>
                    <input type="text" name="email" value="" class="form-control input-lg" placeholder="Your Email"  /><input type="password" name="password" value="" class="form-control input-lg" placeholder="Password"  /><input type="password" name="confirm_password" value="" class="form-control input-lg" placeholder="Confirm Password"  />                    <label>Birth Date</label>                    <div class="row">
                        <div class="col-xs-4 col-md-4">
                            <select name="month" class = "form-control input-lg">
<option value="01">Jan</option>
<option value="02">Feb</option>
<option value="03">Mar</option>
<option value="04">Apr</option>
<option value="05">May</option>
<option value="06">Jun</option>
<option value="07">Jul</option>
<option value="08">Aug</option>
<option value="09">Sep</option>
<option value="10">Oct</option>
<option value="11">Nov</option>
<option value="12">Dec</option>
</select>                        </div>
                        <div class="col-xs-4 col-md-4">
                            <select name="day" class = "form-control input-lg">
<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
<option value="4">4</option>
<option value="5">5</option>
<option value="6">6</option>
<option value="7">7</option>
<option value="8">8</option>
<option value="9">9</option>
<option value="10">10</option>
<option value="11">11</option>
<option value="12">12</option>
<option value="13">13</option>
<option value="14">14</option>
<option value="15">15</option>
<option value="16">16</option>
<option value="17">17</option>
<option value="18">18</option>
<option value="19">19</option>
<option value="20">20</option>
<option value="21">21</option>
<option value="22">22</option>
<option value="23">23</option>
<option value="24">24</option>
<option value="25">25</option>
<option value="26">26</option>
<option value="27">27</option>
<option value="28">28</option>
<option value="29">29</option>
<option value="30">30</option>
<option value="31">31</option>
</select>                        </div>
                        <div class="col-xs-4 col-md-4">
                            <select name="year" class = "form-control input-lg">
<option value="1935">1935</option>
<option value="1936">1936</option>
<option value="1937">1937</option>
<option value="1938">1938</option>
<option value="1939">1939</option>
<option value="1940">1940</option>
<option value="1941">1941</option>
<option value="1942">1942</option>
<option value="1943">1943</option>
<option value="1944">1944</option>
<option value="1945">1945</option>
<option value="1946">1946</option>
<option value="1947">1947</option>
<option value="1948">1948</option>
<option value="1949">1949</option>
<option value="1950">1950</option>
<option value="1951">1951</option>
<option value="1952">1952</option>
<option value="1953">1953</option>
<option value="1954">1954</option>
<option value="1955">1955</option>
<option value="1956">1956</option>
<option value="1957">1957</option>
<option value="1958">1958</option>
<option value="1959">1959</option>
<option value="1960">1960</option>
<option value="1961">1961</option>
<option value="1962">1962</option>
<option value="1963">1963</option>
<option value="1964">1964</option>
<option value="1965">1965</option>
<option value="1966">1966</option>
<option value="1967">1967</option>
<option value="1968">1968</option>
<option value="1969">1969</option>
<option value="1970">1970</option>
<option value="1971">1971</option>
<option value="1972">1972</option>
<option value="1973">1973</option>
<option value="1974">1974</option>
<option value="1975">1975</option>
<option value="1976">1976</option>
<option value="1977">1977</option>
<option value="1978">1978</option>
<option value="1979">1979</option>
<option value="1980">1980</option>
<option value="1981">1981</option>
<option value="1982">1982</option>
<option value="1983">1983</option>
<option value="1984">1984</option>
<option value="1985">1985</option>
<option value="1986">1986</option>
<option value="1987">1987</option>
<option value="1988">1988</option>
<option value="1989">1989</option>
<option value="1990">1990</option>
<option value="1991">1991</option>
<option value="1992">1992</option>
<option value="1993">1993</option>
<option value="1994">1994</option>
<option value="1995">1995</option>
<option value="1996">1996</option>
<option value="1997">1997</option>
<option value="1998">1998</option>
<option value="1999">1999</option>
<option value="2000">2000</option>
<option value="2001">2001</option>
<option value="2002">2002</option>
<option value="2003">2003</option>
<option value="2004">2004</option>
<option value="2005">2005</option>
<option value="2006">2006</option>
<option value="2007">2007</option>
<option value="2008">2008</option>
<option value="2009">2009</option>
<option value="2010">2010</option>
<option value="2011">2011</option>
<option value="2012">2012</option>
<option value="2013">2013</option>
</select>                        </div>
                    </div>
                     <label>Gender : </label>                    <label class="radio-inline">
                        <input type="radio" name="gender" value="M" id=male />                        Male
                    </label>
                    <label class="radio-inline">
                        <input type="radio" name="gender" value="F" id=female />                        Female
                    </label>
                    <br />
              <span class="help-block">By clicking Create my account, you agree to our Terms and that you have read our Data Use Policy, including our Cookie Use.</span>
                    <button class="btn btn-lg btn-primary btn-block signup-btn" type="submit">
                        Create my account</button>
            </form>          
          </div>
</div>            
</div>
1
задан 25.01.2017, 18:26
0 ответов

Твоя проблема проистекает того, что ты не подаешь статический контент. Чтобы это делать с Express они присоединяются следующая линия:

app.use(express.static('./assets'));

Предполагая, что каталог assets он имеет внутри js и css, в твоих совещаниях ты должен снабжать ссылками их как относительные:

<script src="/js/bootstrapPage.js"></script>
2
ответ дан 03.12.2019, 17:30
  • 1
    Тема была из-за ahí большое спасибо!!!, я должен добавлять таким образом файлы javascript, это я функционировало, чтобы добавлять внешний рукописный шрифт. Не, если то, что ты сказал мне, функционировало, и я не сумел делать это, но был далеко отпечаток, чтобы мочь решать мою проблему. app.get (' / bootstrapPage.js' function (req, домашнее животное) { res.sendFile ((__ dirname + ' / bootstrapPage.js')); }); –  25.01.2017, 20:11
  • 2
    Это не правильный способ это делать. Express поставляет тебе способ уже чтобы снабжать ссылками está костариканские, нет необходимости посылать файл. –  25.01.2017, 20:12
  • 3
    Ах ok, уже я parecí в, тогда я думаю, что я не понимаю форму, в которой ты это сделал :( буду продолжать пробовать тогда посмотрим, могу делать это. –  25.01.2017, 20:15
  • 4
    Сейчас, если я я функционирую, моя проблема состояла в том, что у него не было определенного express, я был должен добавлять: var express = require (' express'); app.use (express.static ('./public')); –  25.01.2017, 20:39
  • 5
    Он радует меня, что ты это решил. Привет. –  25.01.2017, 20:44