Question

我在页面上有两个表单提交，它们都做同样的事情。

一个位于工具栏/导航栏上，另一个位于主页面中我遇到的问题是，一旦我在工具栏上添加了表单，主页面上的表单在触发时就不会有搜索值，如果我在工具栏中注释掉那个，那么主页面就会有值。

//Toolbar submit
<form>
  <div class="input-append">
    <input type="text" class="span3" placeholder="Enter name" />
    <button type="submit" class="btn-u">Go</button>
   </div>
 </form>

// Main page submit
<form class="form-inline margin-bottom-5">
  <div class="input-append">
    <input type="text" class="input-xxlarge" placeholder="Enter class name">
    <button type="submit" class="btn-u">Go</button>
  </div>
</form>

//JavaScript/JQuery
$("form").submit(function (e) {

  var searchTerm = $("input:first").val();
  if (searchTerm === '') {
    // This part of the code is reached for the second submit,
    // I have tried using id on the submit but have the same result
  }

Answer 1

更改以下内容，当它在页面上寻找第一个输入时，这将查找实际提交的表单中的第一个输入。

var searchTerm = $("input:first").val();

要

var searchTerm = $(this).find("input:first").val();

Answer 2

您正在寻找var searchTerm = $("input:first").val();没有告诉您正在寻找提交表单中的第一个输入。在这里，您正在寻找页面第一种形式的第一个输入。将其替换为var searchTerm = $(this).find("input:first").val();

编辑：呃，我回答太慢了......至少它证实了这个解决方案。

Answer 3

使用'this'确保您在提交的表单中查找第一个输入：

$("form").submit(function (e) {

   var searchTerm = $(this).find("input:first").val();
   if (searchTerm === '') {
      // This part of the code is reached for the second submit,
      // I have tried using id on the submit but have the same result
   }

两个表单在同一页面上提交，只有第一个表单有效。 JQuery的

3 个答案: