Question

例如，我有5个div，每个div包含一个隐藏的输入字段。启动时，所有div都被css隐藏。

CSS -

.divs_nav{
    display:none
}

Divs -

<div id="1" class="divs_nav"> Div - 1
    <input type="hidden" id="id_qno-1" class="class_qno" value="Question-101" />
</div>
<div id="2" class="divs_nav"> Div - 2
    <input type="hidden" id="id_qno-2" class="class_qno" value="Question-102" />
</div>
<div id="3" class="divs_nav"> Div - 3
    <input type="hidden" id="id_qno-3" class="class_qno" value="Question-103" />
</div>
<div id="4" class="divs_nav"> Div - 4
    <input type="hidden" id="id_qno-4" class="class_qno" value="Question-104" />
</div>
<div id="5" class="divs_nav"> Div - 5
    <input type="hidden" id="id_qno-5" class="class_qno" value="Question-105" />
</div>

在实际代码中，这些div的数量可能达到500或更多，其外观由上一个，下一个导航按钮定义。但是为了演示这里，我通过5个按钮和jquery来做这个。

按钮 -

<input type="button" id="btn-1" value="1" class="divButton" />
<input type="button" id="btn-1" value="2" class="divButton" />
<input type="button" id="btn-1" value="3" class="divButton" />
<input type="button" id="btn-1" value="4" class="divButton" />
<input type="button" id="btn-1" value="5" class="divButton"/>

Jquery -

$('.divButton').click(function() {
    var blockId = this.value;
    document.getElementById(1).style.display = "none";
    document.getElementById(2).style.display = "none";
    document.getElementById(3).style.display = "none";
    document.getElementById(4).style.display = "none";
    document.getElementById(5).style.display = "none";
    document.getElementById(blockId).style.display = "block";
    });

现在出现了真正的问题 - 我在上面提到的Div之外有一个按钮，它总是可见的。 我想要的是，当前可见div中隐藏输入字段的值（点击此按钮）。

<input type="button" id="activeQno" value="Get Active Q. No." class="activeQno"/>

我完全被困在这里。获取所需信息的jquery应该是什么？

Link of JsFiddle of this e.g.

感谢。的问候，

Answer 1

您需要选择当前使用jquery可见的所有div。然后选择此可见div中的输入，然后返回其值：

$('.activeQno').click(function() {
    alert($('.divs_nav:visible > input').val());
});

Here the updated fiddle

Answer 2

尝试一下：

$('.activeQno').click(function() {
    console.log($(".divs_nav:visible").find("input").val());
});

它找到具有类.divs_nav的元素＆＃34;可见＆＃34;，使用find（）查看其中并获取隐藏字段的值。

这是一个fidde：http://jsfiddle.net/V7CFU/13/

Answer 3

我会通过为其分配一个类来实现它

DEMO http://jsfiddle.net/V7CFU/14/

$('.divButton').click(function () {
    var blockId = this.value;
    $('.currentQ').removeClass('currentQ');
    document.getElementById(1).style.display = "none";
    document.getElementById(2).style.display = "none";
    document.getElementById(3).style.display = "none";
    document.getElementById(4).style.display = "none";
    document.getElementById(5).style.display = "none";
    document.getElementById(blockId).style.display = "block";
    $('#' + blockId).addClass('currentQ');
});
$('.activeQno').click(function () {
    var value = $('.currentQ').find('input').val();
    alert(value);
});

如何从其隐藏的输入字段中获取样式为块和值的div

3 个答案: