未触发jquery Form.submit处理程序

尝试使用

form.submit（event）

处理程序根据以下示例使用ajax发送表单数据。

但我的处理函数似乎根本没有触发，我尝试添加了returnfalse和各种防止默认行为的方法，但是表单仍然被提交到操作文件

Javascript:

$('#formWebUI').submit(function(e) {

        e.preventDefault();
        e.stopPropagation();
        e.stopImmediatePropagation();

        let form = $(this);
        let url = form.attr('action');

        $.ajax({
               type: "POST",
               url: url,
               data: form.serialize(), // serializes the form's elements.
               success: function(data)
               {
                   ChangeLocation();
               }
             });
        return false;
    });

HTML

<form id="formWebUI" class="form-inline pb-5" action="/php/form_WebUI.php" method="POST">
      <div class="container">
        <div class="row">
          <div class="col-3 p-0">
            <div class="form-group">
              <input type="text" class="form-control w-100" id="alias" name="alias" placeholder="Alias">
            </div>
          </div>
          <div class="col-7 px-1">
            <div class="form-group">
              <input type="text" class="form-control w-100" id="text" name="text" placeholder="Text">
            </div>
          </div>
          <div class="col-2 p-0">
            <input type="submit" class="btn btn-secondary w-100" id="formWebUI" value="Add">
          </div>
        </div>
      </div>
    </form>

我还尝试将按钮设置为元素按钮而不是输入。元素的类型始终为submit never按钮。

---

我曾尝试使用javascript发出警报，但似乎无论我做什么，都不会调用处理程序。如果有任何建议，我将不胜感激

您的输入元素与表单共享相同的id。确保元素具有唯一的id，然后将.submit绑定到表单id

将JQuery包装成$（文档）。ready为我解决了这个问题。请参见此处的JSFIDLE：

---

好的，我刚刚发现了问题

表单通过Ajax从其他文件异步加载。因此，当我注册侦听器时，它实际上是在加载表单之前，并且可以受到适当的影响

---

因此，为了解决这个问题，我只需在从文件加载表单后重新初始化侦听器

控制台中是否有任何错误？jQuery代码是否在

$（文档）中？准备就绪
？没有错误，是在$（文档）中。readywe无法使用您使用的重复id（“formWebUI”）。所以使用不同的ID当一个ID被复制时，选择器会找到第一个，因此它似乎应该匹配表单而不是输入。是的，谢谢。我做了关于ID的笔记，只是为了让他不会错过副本。我拼命地在“提交”按钮上尝试ID，但最初它只是在表单上。我真的很感激如此快速的响应和善意的帮助，谢谢。看到了吗
$( document ).ready(function(){
    $('#formWebUI').submit(function(e) {

        e.preventDefault();
        e.stopPropagation();
        e.stopImmediatePropagation();

        let form = $(this);
        let url = form.attr('action');

        $.ajax({
               type: "POST",
               url: url,
               data: form.serialize(), // serializes the form's elements.
               success: function(data)
               {
                   ChangeLocation();
               }
             });
        return false;
    });
});