Question

我正在制作一些东西来检查一个方框并将其旁边的文字更改为超链接

<li class="myList">
<input class="myCheckBox" type="checkbox" name="frank"  value="someVal"/>
<span style="dispaly:none;">
<a class="navigation">mylink</a>
</span>
<span>myLink</span>
</li>
<li class="myList">
<input class="myCheckBox" type="checkbox" name="frank"  value="someVal"/>
<span style="dispaly:none;">
<a class="navigation">mylink</a>
</span>
<spanmyLink></span>
</li> .. and so on

希望你可以收集我有2个项目，我想要一个可见的默认值，直到勾选复选框并且超链接span标记取代默认的span标记。对style="display:none"其他人的更改变为style="display:block"

现在为jQuery

$(window).load(function(){
          $('.myCheckBox').click(function(){
           //DO DOMETHING
          });       
      });

但是，一旦我发生了点击事件，我将如何获得对这些跨度的访问，以便更改各种元素的样式等。

由于

Answer 1

您将从this开始，这是当前元素，然后使用任何the tree traversal functions来移动DOM，例如：

$(window).load(function(){
  $('.myCheckBox').change(function() {
    $(this).next("span").toggle(this.checked);
  });       
});

在上面我们使用.toggle(bool)进行隐藏/显示，这样我们就可以隐藏/显示<span>，具体取决于我们关注的复选框是否已经过检查。

使用jQuery访问各种元素

1 个答案: