jQuery脚本 - 使股利按钮可见点击

- 在我的身边，我有我的头以下：

<script src="http://code.jquery.com/jquery-1.10.1.min.js"></script> 
<script> 
    $(document).ready(function() { 
     $("button").click(function() { 
      $("p").toggle(); 
     }); 
    }); 
</script>

这作为我的HTML：

<a id="button" href="#">Show/Hide</a> 
<div id="item">Item</div>

我如何使另一个botton，和另一个DIV，不对上一个按钮单击作出反应

我想让1项目1 disapear/visible我想要2项目2 Diapear /可见，怎么是那可能。如果你想多个元素采取同样

http://jsfiddle.net/BQUyT/211/

来源

2014-10-19 user3442766

-1

不能使用相同的ID多次。相反，您可以使用CLASS。 HTML：

<a class="button" href="#">1</a> 
<div class="item">Item 1</div> 

<a class="button" href="#">2</a> 
<div class="item">Item 2</div> 

JS: 

$(".button").click(function() { 
    var index=$(".button").index(this); 
    $('.item').eq(index).toggle(); 
});

这里举例：http://jsfiddle.net/BQUyT/221/

来源

2014-10-19 10:23:42

http://jsfiddle.net/BQUyT/220/ – user3442766 2014-10-19 10:25:59

非常硬编码。 – 2014-10-19 10:26:44

这是说“只是切换下一个项目” ... – Alnitak 2014-10-19 10:26:53

ID必须是唯一的
，给他们一个class（例如button）。
$('.button').on('click', function() { $(this).next().toggle() });

后者只是说按钮“与类元素时‘’点击，拨动在DOM中找到的下一个元素的可见性状态”

NB：我我们使用.on('click')而不是.click()，因为在我们的编码指南中，我认为.click已弃用，即使jQuery开发者本身没有。 .click会引起混淆，因为它可以同时处理寄存器处理程序和触发器处理程序。相反，我们总是对前者使用明确的.on，对后者使用.trigger。

演示在http://jsfiddle.net/alnitak/BQUyT/217/

来源

2014-10-19 10:15:34 Alnitak

downvoter - 请解释！或者这只是一个报复而已，因为我已经低估了一些编码效率低下的答案？ – Alnitak 2014-10-19 10:35:08

你可以使用jQuery的toggleClass添加和删除一个CSS-类隐藏或显示#item股利。

CSS

#item.hidden { 
    display: none; 
}

$("#button").on('click', function() { 
    $("#item").toggleClass('hidden'); 
});

更新的jsfiddle here

来源

2014-10-19 10:16:14 jollelj

jQuery的'.toggle'是便携式动画比'.toggleClass'更好 - 当与CSS特效相结合，后者只能提供平滑的过渡。 – Alnitak 2014-10-19 10:17:53

http://secure.securehome.nu/proddigi.aspx 这就是我想用它，这样你就可以展开和检查有关产品的信息，是否有任何其他方式/更好的方式来做到这一点:) – user3442766 2014-10-19 15:48:35

有你的HTML和脚本的一些 '错误'。

首先，你的html中的id必须是唯一的。改为使用class。

点击后，切换下一个元素

$(".button").click(function() { 
    $(this).next().toggle(); 
});

检查JSFiddle

来源

2014-10-19 10:17:36 Barry

jQuery脚本 - 使股利按钮可见点击

回答

相关问题