我输入的东西第一次点击提交后出现了李,这很好。但是当我再次点击它时,输出打印2次,3次打印3次,依此类推。为什么?我只想在每次点击时打印一次。
客户端:
var socket = io()
var name;
var msg;
$("#nameForm").on("submit", function(e){
var name = $(".nameInput").val()
socket.emit("heres name", name);
socket.on("outputName", function(data){
name = data;
$(".messages").append("<li>" + name +"</li>")
// $("#nameForm").fadeOut()
})
e.preventDefault();
})
HTML:
<div class="chatArea">
<ul class="messages"></ul>
</div>
<form id = "nameForm">
<input type="text" class="nameInput"><button>Enter Name</button>
</form>
<form id = "msgForm">
<input class="msgInput" type= "text"></input><button>Enter message</button>
</form>
<script src ="http://code.jquery.com/jquery-2.1.1.js"></script>
<script src="https://cdn.socket.io/socket.io-1.2.0.js"></script>
index.js:
var express = require("express")
var app = express();
var server = require("http").createServer(app);
var io = require("socket.io")(server);
var port = process.env.PORT || 8080;
server.listen(port, function(){
console.log("server is listening on port %d", port)
})
app.use(express.static(__dirname + "/public"));
var usernames = {};
var numUsers = 0;
var msg;
io.on("connection", function(socket){
var addedUser = false;
socket.on("heres name", function(username){
++numUsers;
addedUser = true
usernames.username = username
socket.emit("outputName", usernames.username)
})
})
答案 0 :(得分:0)
您必须在点击时阻止提交按钮并等待响应并在响应时解锁该按钮。
var socket = io()
var name;
var msg;
$("#nameForm").on("submit", function(e){
$("#nameForm input[type='submit']").disable();
var name = $(".nameInput").val()
socket.emit("heres name", name);
socket.on("outputName", function(data){
name = data;
$(".messages").append("<li>" + name +"</li>");
$("#nameForm input[type='submit']").enable();
// $("#nameForm").fadeOut()
})
e.preventDefault();
})
不要忘记在你的行尾添加分号!
<强>更新强>
var socket = io();
var name;
var msg;
socket.on("outputName", function(data){
name = data;
$(".messages").append("<li>" + name +"</li>");
$("#nameForm input[type='submit']").enable();
})
$("#nameForm").on("submit", function(e){
$("#nameForm input[type='submit']").disable();
var name = $(".nameInput").val();
socket.emit("heres name", name);
e.preventDefault();
})