提交具有后续重置价值的表格

Question

问题是，当您第一次单击时，将 value 更改为 add 到 delete，但在重新单击 add 时表单未发送 value 更改并将表格提交给 add.

怎么办？单击 > 发送 > 替换

形式

<form id="favorite" method="GET" action="" enctype="multipart/form-data" target="iframe">
    <input type="submit" id="fav" name="favorite" value="add"/>
</form>

js

$(function(){$('#fav').click(
    function() {
        $(this).val() == "add" ? delete_item() : add_item();
    });
});
function delete_item() {
    $('#fav').val("delete");
}
function add_item() {
    $('#fav').val("add");
}

Answer 1

我创建了一个 jsfiddle 来向您展示我将如何做...

Html

<div id="MyForm">
  <form id="favorite" method="GET" action="" 
        enctype="multipart/form-data" target="iframe">
    <input type="submit" id="fav" name="favorite" value="add" />
  </form>
</div>

Js

    $(function() {
      $("#MyForm").on('click', '#fav', function() {
        $(this).val() == "add" ? delete_item() : add_item();
        console.dir($(this));
        return false;
      });
    });

    function delete_item() {
      $('#fav').val("delete");
    }

    function add_item() {
      $('#fav').val("add");
    }

我放了一个return false;所以在我的示例中不会提交表单，你应该删除它才能使用代码。
我放了一个容器div来正常使用$.on()
我放了一个console.dir所以你可以调试它，你可以删除它来使用代码。

提交具有后续重置价值的表格

Submitting the form with subsequent replacement value

javascript

forms

jquery

submit

Html

Js