【问题标题】:jQuery send value of hidden field on click eventjQuery在点击事件上发送隐藏字段的值
【发布时间】:2012-09-11 23:00:45
【问题描述】:

我正在使用以下模板来显示数据库中的数据。它被重复并且多次使用相同的类。我想在btnDeleteonclick 事件上传递该模板中隐藏字段的值。

<div class="Template">
    <div class="Title"></div>
    <div class="Price"></div>
    <div class="_Qty">Total Tickets:<div class="TotalQty"></div></div>
    <div class="_Qty1">Sold Tickets:<div class="UsedQty"></div></div>
    <div class="_Date">On Sale:<div class="StartDate"></div></div>
    <div class="_Date1">Sale Ends:<div class="EndDate"></div></div>
    <input type="hidden" value="8c991c10-7d88-4212-b931-5bfeff4ebcd0" />
    <input type="button" class="btnDelete" value="Remove Ticket" onclick="fnRemoveTicket(**THIS IS WHERE I NEED TO PASS HID VALUE**);"/>
    <input type="button" class="btnEdit" value="Edit Ticket"/>
</div>

我不知道如何传递与按钮在同一个父项中的隐藏字段的值。通常,我会选择带有某种类型的唯一选择器的按钮。然后执行$(this).closest$(this).parent 之类的操作。由于该按钮没有任何独特之处,因此我必须将其与onclick 事件一起传递,但我不知道如何使其工作。

【问题讨论】:

    标签: jquery buttonclick


    【解决方案1】:

    您可以使用prevsiblings 方法。

    $('.btnDelete').click(function(){
         var val = $(this).prev().val();
         // var val = $(this).siblings("input[type='hidden']").val()
    })
    

    【讨论】:

      【解决方案2】:

      使用类似的东西

      $('input.btnDelete').on('click', function(){
          var hidden = $(this).parent().find('input[type="hidden"]');
          /* actions */
      }
      

      【讨论】:

      • 谢谢 - 这很接近 - 但我的页面上有不止一种类型的按钮,所以我必须在其中使用 .where() ,而另一个答案与类选择器相同
      • 您将使用正确的选择器而不是 $('input[type="button"]')。我的代码只是“如何做”的一个例子。
      • 我知道,我明白了,我只是在评论你的工作正常 - 只是其他答案几乎在同一时间几乎相同,但他的更接近一点,所以我必须接受他的
      【解决方案3】:

      您可以使用siblings() 方法找到附近的元素留在同一个父级。 即:

       $('input.btnDelete').click(function(){
         var $hiddenVal = $(this).siblings('input[type="hidden"]').val();
         fnRemoveTicket($hiddenVal);
      });
      

      下面是可行的演示:jsFiddle

      【讨论】:

        猜你喜欢
        • 2018-12-24
        • 2014-06-09
        • 1970-01-01
        • 1970-01-01
        • 2011-09-27
        • 2013-08-29
        • 2016-11-01
        • 1970-01-01
        • 1970-01-01
        相关资源
        最近更新 更多