强制点击提交按钮两次

Posted 2023-02-24

【中文标题】强制点击提交按钮两次

【英文标题】：Forced to click submit button twice

【发布时间】：2018-11-13 05:49:56

【问题描述】：

我有 Laravel 5.5 一个页面，它有两种形式但使用相同的控制器和方法。第一种形式是为了迎合最初的细节，但第二种形式是一种搜索形式。我的搜索表单有效，但只有当您单击搜索按钮两次时，我才能强制单击一次以提交该表单。

查看

<form name="FormSearch" id="FormSearch" method="post" action="!! action(MyController@index',$customID) !!">
<input type="text" name="searchDets" id="searchDets" value="" />
<input type="submit" class="btn btn-default" name="searchMe" id="searchMe" value= "Search Me"/>
</form>

Js

$('#FormSearch').click(function(e)
    e.preventDefault();
    $('#filterSearchForm').submit();
); 

我希望我的视图页面提交一次。

【问题讨论】：

分享你的 filterSearchForm 的代码

你为什么使用 preventDefault ？

我已经删除了 e.preventDefault 但它仍然需要用户点击两次

如果您确实必须使用javascript提交表单，请将提交按钮类型更改为按钮而不是提交。我并不是说这会导致您的问题，但会提高可读性和意图。

【参考方案1】：

首先，我找不到 id 为 filterSearchForm 的元素，所以，当你点击它时，我做了一个编辑，提交了相同的表单（即FormSearch）：

$('#FormSearch').click(function(e)
    //e.preventDefault();
    $('#FormSearch').trigger('submit');
); 

我使用了触发事件，当您单击表单FormSearch 时，它会提交表单FormSearch。

这是它的工作原理：

$('#FormSearch').click(function(e) 
  //e.preventDefault();
  $('#FormSearch').trigger('submit');
);

$("#FormSearch").submit(function(e)
  e.preventDefault();
  alert('submitted');
);

#FormSearch
  background: black;

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<form name="FormSearch" id="FormSearch" method="post" action="!! action(MyController@index',$customID) !!">
  <input type="text" name="searchDets" id="searchDets" value="" />
  <input type="submit" class="btn btn-default" name="searchMe" id="searchMe" value="Search Me" />
</form>

<p>
  ** Click anywhere on the black area.
</p>

我希望这会有所帮助。

【参考方案2】：

我遇到了同样的问题，这是由于 js 版本。所以请检查您的 jquery.validate 版本。 您可以在这里获取更多信息submit button twice click issue