"提交按钮单击未触发"

Question

我有一个这样的表单，我试图让提交按钮显示警报，但它似乎没有做任何事情，我在控制台中没有错误。 我包含了所有必需的 jQuery，因为我在页面的另一部分有一个类似的表单，并且输入提交工作，但这个表单似乎不是。

<div id="div_1" style="display:none;">
            <form id="form1">

               <fieldset style="border:0;">
                  <div>
                        <label for="name">Name</label>
                        <input id="name" name="name" placeholder="First name" required type="text">
                    </div>
                    <div>
                        <input id="submit-button" type="submit" value="Submit">
                    </div>

                </fieldset>
            </form>

            <div>
                <button id="close" type="submit" value="Close">
            </div>
        </div>

Answer 1

确保在元素位于 doctree 之后运行 javascript。

使用它而不仅仅是你的js：

$(document).ready(function())
{
    $("#submit-button").click(function(){
        alert("boo");
    });
}

这确保了 DOM 树被加载，然后它会绑定 click 事件。 如果在 JS 文件中绑定 click 事件，它可能会在元素在 DOM 树中之前被加载，从而使 jQuery 选择器无法找到元素（因此 click 事件不会触发，因为它没有被绑定）。

Answer 2

万一其他人出于与我相同的原因来到这里，只是提醒一下“提交”事件侦听器需要附加到表单本身，而不是提交按钮