一页上有多个提交按钮但可区分（jquery）答案

【问题标题】：Multiple submit buttons on one page but distinguishable (jquery)一页上有多个提交按钮但可区分（jquery）
【发布时间】：2014-04-27 23:32:55
【问题描述】：

我正在尝试编写一个“为以后存储项目”的代码 - 一个将项目的 url 作为隐藏输入的按钮，在提交时它调用一个 php 脚本，该脚本在数据库中进行存储。我更喜欢 php，对任何面向对象的知识都知之甚少，但我需要使用 jquery 来调用 php 脚本而不需要移到那里

问题是当我在一页上有多个表单时如何分配 x 和 y 变量

我只能写以下内容

 $("form").bind('submit',function(e){
   e.preventDefault();

      var x =  $("input[type=hidden][name=hidden_url]").val();
      var y =  $("input[type=hidden][name=hidden_title]").val();



   $.ajax({
   url: 'save_storage.php?url='+x+'&tit='+y,
   success: function() {
    alert( "Stored!");
     location.reload();
   }
});

});

如果你有类似...的东西，它工作正常

<form method="post" action="#">
 <input type="hidden" id="hidden_url"  name="hidden_url" value="<?php echo $sch_link; ?>"/>
 <input type="hidden" id="hidden_title" name="hidden_title" value="<?php echo $sch_tit; ?>"/>
 <input type="submit" id="send-btn"  class="store" value="Store" />
</form>

..在页面上，我有大约 50 个。

这些是通过 for 循环生成的，我想我可以使用 $i 作为标识符，但是我如何告诉 jquery 仅分配实际单击的表单/提交的变量？

【问题讨论】：

这应该有助于stackoverflow.com/questions/13036676/…

标签： php jquery forms submit

【解决方案1】：

您必须确定隐藏字段的范围才能仅在当前表单中查看。在事件处理程序中，this 将引用正在提交的表单。这只会在该表单中找到与给定选择器匹配的输入。

$("form").bind('submit',function(e){
  e.preventDefault();

  var x =  $(this).find("input[type=hidden][name=hidden_url]").val();
  var y =  $(this).find("input[type=hidden][name=hidden_title]").val();

  $.ajax({
    url: 'save_storage.php',
    data: {
      url: x,
      tit: y
    },
    success: function() {
      alert( "Stored!");
      location.reload();
    }
  });
});

正如@Musa 所说，最好为$.ajax 调用提供data 键以传递您的字段值。

【讨论】：

【解决方案2】：

在您的表单提交处理程序中，您可以通过this 变量访问表单元素。在搜索适当的输入以传递给 AJAX 数据时，您可以使用它为选择器提供一些上下文。

是这样的：

$("form").bind('submit',function(e) {
    e.preventDefault();

    // good practice to store your $(this) object
    var $this = $(this);

    // you don't need to make your selector any more specific than it needs to be
    var x = $this.find('input[name=hidden_url]').val();
    var y = $this.find('input[name=hidden_title]').val();

    $.ajax({
        url: 'save_storage.php',
        data: {url:x, tit: y},
        success: function() {
            alert( "Stored!");
            location.reload();
        }
    });
});

此外，每个页面的 ID 必须是唯一的，因此请从您的输入中删除您的 id 属性。

【讨论】：