Question

我试图通过单击按钮提交包含事件数据的表单。我有以下jQuery代码来触发事件。但这并没有被触发。

$(function() {

  $('#button1,#button2').on('click', function(e) {
    //e.preventDefault();
    $('form#form1').submit({
      "url": "url"
    }, doSomethint);
  });

  function doSomethint(e) {
    var url = ev.data.url;
    alert(url);
  }

});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<button type="submit" id="button1">Button1</button>
<button type="submit" id="button2">Button2</button>

<form id="form1">
  <input type="text" value="123">
</form>

https://jsfiddle.net/1bdesjof/

Answer 1

因为提交按钮不在form标记中，并且变量ev未定义。

SELECT field1, TRIM(both '()' FROM field1) FROM table1

$(function() {

  $('#button1,#button2').on('click', function(e) {
    //e.preventDefault();
    $('form#form1').submit({
      "url": "url"
    }, doSomethint);
  });

  function doSomethint(ev) {
    var url = ev.data.url;
    alert(url);
  }

});

Answer 2

区别：

$('#form1').submit()，它将提交表单

$('#form1').submit(eventData, handler)将事件添加到表单

因为您的提交按钮位于form之外，所以没有调用submit事件。解决方法是，将按钮添加到表单容器中，或在添加事件后调用$('#form1').submit()，如下所示。

$(function() {

  $('#button1,#button2').on('click', function(e) {
    //e.preventDefault();
    $('#form1').submit({
      "url": "url"
    }, doSomethint);
    // call it
    $('#form1').submit()
  });

  function doSomethint(ev) {
    var url = ev.data.url;
    alert(url);
  }

});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<button type="submit" id="button1">Button1</button>
<button type="submit" id="button2">Button2</button>

<form id="form1">
  <input type="text" value="123">
</form>

传递事件数据时未触发jQuery表单提交

2 个答案: