为什么当我单击表单内的按钮时永远不会到达提交块？答案

【问题标题】：why the submit block is never reached when i click button inside form?为什么当我单击表单内的按钮时永远不会到达提交块？
【发布时间】：2015-02-02 10:40:27
【问题描述】：

我正在 nodejs 中创建一个聊天应用程序。

在 index.html 文件中，我设置了用户发送消息的界面，我定义了以下形式：

<form id="chat-form" name="chat-form">
     <input type="text" name="chat-input" id="chat-input" placeholder="type message">
     <br>
     <input type="submit" value="send"/>
</form>

在<head> </head> 标签内，我使用以下脚本：

$('#chat-form').submit(function(e){
    console.log("inside the submit");
});

虽然预期此代码可以工作，但从未到达提交代码。

【问题讨论】：

把你的代码放在 document.ready 中，比如 $(document).ready(function(){ $('#chat-form').submit(function(e){ console.log("inside提交"); }); });

标签： javascript jquery forms

【解决方案1】：

如果您在 head 中调用您的代码，那么代码会在您呈现 html 之前运行，因此此时 html 表单将不存在。

一般的最佳做法是将您的 javascript 代码放在文件底部，就在关闭 body 标记之前和/或在 dom 就绪函数中运行它。

$(function(){ [code]});

在上述函数中运行的任何代码都会在 dom 加载后运行，因此您的 html 将在此时存在。

$(function(){
    $('#chat-form').submit(function(e){
        console.log("inside the submit");
    });
});

【讨论】：

谢谢。这做到了。你能解释一下为什么必须这样吗？我当然可以在线搜索，但它会更具解释性。
@JoãoMartins 你在头部调用你的代码，所以 html 表单此时不存在？
@Regent 他只是说在函数中运行它......然后他编辑了这个问题。 stackoverflow 用户太激进了。男人。放松
@Regent 公平地说，我认为 OP 评论是在我最初的回答和我的编辑之间添加的，以提供更多信息。
@atmd 对于我所看到的所有内容，引用的短语在评论之前就在那里。然而，最大的问题是人们既没有学习 jQuery 基础知识，也没有在 Internet 上寻找解决问题的方法。每天看到很多相同的问题肯定是不正常的。 document.ready，委托事件处理和ajax异步执行位列前三。