Question

我有一个HTML Div（我正在使用Twitter Bootstrap隐藏显示div2），如下所示：

HTML：

<div id="div1">
  <button id="mybtn">Button</button>
  <div id="div2" class="modal hide fade span12" style="display: none;">
    <button id="anotherButton" data-char="">AnotherButton</button>
  </div>
</div>

使用jQuery即时尝试在点击data-char时更改mybtn的值。但是没有成功导致隐藏div2。 console.log($('#anotherButton'));返回一个空数组。

有没有办法用jQuery或Javascript访问隐藏的DOM？

* 编辑：* 通过尝试这不能更好地工作，返回undefined：

$('#mybtn').live('click', function(e) 
{
    //or e.preventDefault();
    $('#anotherbutton').attr("data-char", "assigned");
    alert($('#anotherbutton').attr("data-char"));
});

Answer 1

你可以指定它

Live demo

$(function(){
    $('#anotherButton').attr('char', "assigned");
    alert($('#anotherButton').attr('char'));
});

按钮上的

单击

<强> Live Demo

$(function(){
   $('#anotherButton').attr('data-char', "assigned");
   alert($('#anotherButton').attr('data-char'));
});

Answer 2

看起来data方法不适用于处于隐藏状态的元素。您应该使用attr方法。

这应该可以正常工作

$(function(){
  $("#mybtn").click(function(e){
    e.preventDefault();
        $("#anotherButton").attr("data-char","new value");
  });    
});

工作样本http://jsfiddle.net/kshyju/a7Cua/4/

Answer 3

它隐藏的事实一无所获。问题可能是js代码在按钮HTML之前。将其放在后面，或者将其放在$(document).ready()之类的监听器中，以确保在您尝试访问它时已经处理过它。

Answer 4

尝试$(button:hidden)

这通常适用于这样的事情，

来源：HTTP：//api.jquery.com/hidden-selector/

如何使用jQuery访问隐藏的Dom元素？

4 个答案: