Question

我有以下HTML代码：

<a class="tog" href="#">Click Me</a> 
<div class="result">
    <input type="hidden" name="hid" value="val01" />
    This is a container div
</div> <br />
<a class="tog" href="#">Click Me</a> 
<div class="result">
    <input type="hidden" name="hid" value="val02" />
    This is a another container div
</div>

如何通过点击<a>从隐藏输入中获取价值？我正在尝试使用这个jquery代码，但它无法从那些隐藏的输入元素中检索值。

$(document).ready(function(){
 $(".tog").click(function(){
   var $this=$(this);
 if (!$this.next(".result").data('loaded')){ 
   alert($this.next("input[name=hid]").val());
  }
 });
});

Answer 1

简单

$(".tog").click(function () {
    var $this = $(this);
    if (!$this.next(".result").data('loaded')) {
        alert($this.next(".result").children("input:hidden").val());
    }
});

Answer 2

应该是：

$(document).ready(function () {
  $(".tog").click(function () {
    var $this = $(this);
    if (!$this.next(".result").data('loaded')) {
        alert($this.next().find("input[name=hid]").val());
    }
  });
});

<强> Demo

Answer 3

您的代码存在的问题是，您正在使用文档中使用的next() 获取匹配元素集中每个元素的紧随其后的兄弟。如果提供了选择器，则仅当它与该选择器匹配时，它才会检索下一个兄弟。。这里你的'$ this'指向锚点，当你尝试执行$this.next("input[name=hid]").val()时，它没有任何名为“hid”的直接兄弟，这就是为什么你没有被定义。

试试这段代码：

$(document).ready(function(){
    $(".tog").click(function(){
       var $this=$(this);
    alert($this.next("div").find("input[name=hid]").val());   
     });
});

jsfiddle

Answer 4

您可以执行以下操作：

使用结果类获取下一个元素div。从那里你可以找到隐藏的输入并获得它的价值。

Demo

<强>使用Javascript：

$(document).ready(function(){
    $(".tog").click(function(){
        var atag = $(this);
        var hiddenInput = atag.next().find('input[type=hidden]');
        alert(hiddenInput.val());         
    });
});

如何从隐藏在div中的输入元素中获取文本

4 个答案: