如何调用位于 div 中的表单按钮？答案

【问题标题】：How to call the form button sitting in div?如何调用位于 div 中的表单按钮？
【发布时间】：2021-01-31 12:23:30
【问题描述】：

以下是我的表单代码：

<form accept-charset="utf-8" action="https:example.com" method="get" name="test"> 
<div class="classy"><input type="button" class="buttonE buttonC" value="CLICK NOW"/></div>
</form>

我有下面的脚本调用按钮提交，失败了，但是如果我删除div类，它可以成功运行。

<script>
$('.buttonE').click(function(e){
$(this).parent().trigger('submit')
})
</script>

您能帮我提供正确的脚本来调用 div 类中的按钮吗？提前致谢！

【问题讨论】：

您可以直接处理您知道的表单的提交事件。没有理由特别涉及按钮（尽管您也需要将其设为 type="submit" 按钮）
按钮的父级是 div，而不是表单。在侦听器中，您可以执行this.form.submit()，但正如 ADyson 所说，只需将其设为提交按钮并在表单的提交处理程序上放置一个侦听器（因为无需单击提交按钮即可提交表单）。
或者直接使用$(this).closest("form").submit()
如果回答对您有帮助，请标记为正确。

标签： javascript php html jquery css

【解决方案1】：

这是我能想到的最简单的解决方案。
只需删除按钮的click 处理程序并将其设置为表单的type="submit"。

<form accept-charset="utf-8" action="https:example.com" method="get" name="test"> 
  <div class="classy">
    <input type="submit" class="buttonE buttonC" value="CLICK NOW"/>
   </div>
</form>

如果你真的想像你拥有的那样使用代码，那么你需要使用两次parent，因为.buttonE的parent是<div class="classy">

<script>
$('.buttonE').click(function(e){
  $(this).parent().parent().trigger('submit');
});
</script>

【讨论】：

【解决方案2】：

你可以像这样为表单设置一个类：

$('.buttonE').click(function(e){
$(".form-app").trigger('submit')
})

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<form accept-charset="utf-8" action="https:example.com" method="get" name="test" class="form-app"> 
  <div class="classy">
    <input type="button" class="buttonE buttonC" value="CLICK NOW"/>   </div>
</form>

注意：如果你已经导入了JQuery库，这里就不需要这行代码了：

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

【讨论】：