Question

我想隐藏一个表单，并且在表单标签之外可以看到提交按钮。我理解如何用jquery做这个并且做了一个小提琴here。我遇到的问题是我使用jquery .on（）在我的页面上呈现某些元素，并且我无法弄清楚在使用.on（）语法时如何提交表单。

如果我把提交按钮放在下面的例子中的表单标签之外，那么jquery不会提交任何内容。

我的表格

<form id="myForm" class="myForm" action="" method="post" style="">
 <input type="hidden" name="name" value="name">
 </form>

   <button type="submit" class=""></button>

我的jquery

$(document).on('submit', '.myForm', '.results', function(e) {
    var new_data = $(this).closest('div').attr('class') 

    e.preventDefault();

    $.ajax({
        url: 'add_tag.php',
        type: 'POST',
        dataType: 'html',
        data: $(this).serialize(),
        success: function(response) {

            $('.' + new_data).hide().fadeIn("slow").append('<td>' + response + '</td>');

        }
    });

    return false;
});

Answer 1

我最近采用的一种方法是使用label和for，并将其设置为按钮。

<form style="display: none" ...>
  ...

  <input type="submit" id="submit">
</form>

<label class="button" for="submit">Submit</label>

由于点击带有for的元素会激活input和相应的id，因此其效果与点击表单内的提交相同。这会解决您的提交问题。

如何使用jquery .on（）在表单外部提交一个提交按钮

1 个答案: