JQuery Form Submit() 不适用于 SocketIO 客户端

Question

我有一个用于聊天客户端的表单，它应该向 Socket IO 服务器提交消息并在聊天中显示它。我的视图可以接收来自其他远程客户端的消息并将它们显示在列表中的我的页面上，所以我知道 Socket IO 服务器正在工作，我认为我对 jQuery 和前端来说太糟糕了，无法让提交表单工作，我难住了。

我有一个 id 为“target”的表单，它应该在按下发送按钮时触发 submit()，但没有任何反应。如何从表单输入中获取文本以附加到 ID 为“消息”的无序列表？

来自我的 HTML：

       <div class="panel-body">
          <ul id="messages" class="media-list">
          </ul>
       </div>

       <form action="" id="target">
        <div class="input-group">
            <input id="m" class="form-control" placeholder="Enter Message" autocomplete="off"/>
            <span class="input-group-btn">
                <button class="btn btn-info" type="button">Send</button>
            </span>
        </div>
       </form>

我的内部JS：

 <script>
        $(function () {
            var socket = io();
            $("#target").submit(function(){
                console.log($('#m').val());
                socket.emit('response message', $('#m').val());
                $('#m').val('');
                return false;
            });
            socket.on('chat message', function(msg){
        	console.log("From user " + msg);
                $('#messages').append($('<li>').text(msg));
            });
            socket.on('response message', function(msg){
        	console.log("From agent " + msg);
                $('#messages').append($('<li>').text(msg));
            });
        });

        </script>

Answer 1

对于您的按钮类型，您需要指定提交以使其成为表单上的提交操作。

<button class="btn btn-info" type="submit">Send</button>