mit jQuery mit socket.io

Question

Ich versuche, jQuery in meiner Datei socket.io js (index.js) zu verwenden.

Jedes Mal, wenn ich versuche,

<script src="http://code.jquery.com/jquery-1.9.1.min.js"></script> 
<script src="/socket.io/socket.io.js"></script> 
<script src="index.js"></script> 
<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)); 
    }); 
    socket.on('new user', function(data){ 
    $('#newUserMessage').text(data); 
    });   
</script> 

ich diesen Fehler in meiner Konsole

GET http://localhost:3000/index.js 

ReferenceError: $ is not defined 

Ich bin nicht sicher zu tun, warum dies geschehen würde?

Aber wenn ich es entfernen kann ich jQuery Funktionen in index.js verwenden?

Meine index.js Datei

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

var $usernameInput = $('.usernameInput'); 

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

io.on('connection', function(socket){ 
    socket.broadcast.emit('new user', 'New User Joined, Say Hi :D'); 
    socket.on('chat message', function(msg){ 
    io.emit('chat message', msg); 
    }); 
}); 

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

function setUsername() { 
    username = cleanInput($usernameInput.val().trim()); 

    if (username) { 
    socket.emit('add user', username); 
    } 
} 

Answer 1

Sie sind ein wenig verwirrt, haben Sie Ihre Front-End und Sie haben Ihre Back-End.

Ihre index.js ist Ihr Backend, Sie führen das mit NodeJS und Sie versuchen nicht, jQuery auf Ihrem Back-End zu verwenden, es gibt kein DOM zu manipulieren. Auch Sie nicht enthalten index.js auf Ihrem Front-End, das ist Back-End-Code.

Das ist falsch:

var $usernameInput = $('.usernameInput'); 

Sie können nicht Ihre DOM zugreifen, der Wert, den Sie es an das hintere Ende senden zu bekommen, mit irgendeiner Art von Veranstaltung wie folgt aus:

Vorder Ende

<script src="http://code.jquery.com/jquery-1.9.1.min.js"></script> 
<script src="/socket.io/socket.io.js"></script> 
<script> 
    var socket = io(); 
    $('form').submit(function(){ 
    socket.emit('chatMessage', $('#m').val()); 
    $('#m').val(''); 
    return false; 
    }); 
    socket.on('connect', function(){ 
    socket.emit('setUser', $('.usernameInput').val().trim()); 
    }); 
    socket.on('chatMessage', function(msg){ 
    $('#messages').append($('<li>').text(msg)); 
    }); 
    socket.on('newUser', function(data){ 
    $('#newUserMessage').text(data); 
    });   
</script> 

Back-End

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.broadcast.emit('newUser', 'New User Joined, Say Hi :D'); 
    socket.on('setUser', function(username){ 
    console.log(username); //here you have your user name 
    }); 
    socket.on('chatMessage', function(msg){ 
    io.emit('chatMessage', msg); 
    }); 
});