jquery - Event.preventDefault() 不起作用？

Question

$("#singlechatpanel-1 #sendMessage").click(function(Event)
{
Event.preventDefault();
$("#singlechatpanel-1 .subpanel ul").append('<li><span><img src="./images/chat-thumb.gif"/>Aristona: Test message.</span></li>');
});



<form name="chatForm" id="chatform">
 <input type="text" id="message" name="message"><br>
 <input type="button" name="sendMessage" id="sendMessage" value="Send Message">
</form>

当我用鼠标单击按钮时，它通常会发送数据，但如果我在文本框中输入内容时按 Enter 键，页面会刷新并且 URI 会转到 message?what_I_typed。

如何预防？我需要使用输入按钮，因为它是一个聊天应用程序。

Answer 1

而是绑定到表单的提交事件。

$("#chatform").submit(function(e) {
    e.preventDefault();
    $("#singlechatpanel-1 .subpanel ul").append('<li><span><img src="./images/chat-thumb.gif"/>Aristona: Test message.</span></li>');
});

Answer 2

试试这个。最后添加return false。

$("#singlechatpanel-1 #sendMessage").click(function(Event)
{
   Event.preventDefault();
   $("#singlechatpanel-1 .subpanel ul").append('<li><span><img src="./images/chat-thumb.gif"/>Aristona: Test message.</span></li>');
   return false;
});

Answer 3

$("#chatform").submit(function(Event) {
  Event.preventDefault();
  $("#singlechatpanel-1 .subpanel ul").append('<li><span><img src="./images/chat-      thumb.gif"/>Aristona: Test message.</span></li>');
});

<form name="chatForm" id="chatform">
  <input type="text" id="message" name="message"><br>
  <input type="button" name="sendMessage" id="sendMessage" value="Send Message">
</form>

这会有所帮助。将处理程序放入表单提交中。