JQuery事件onclick显示/隐藏div

Question

拜托，你能帮帮忙吗？我有一些HTML：

<span class="about" id="but01">About this</span>

<span class="about" id="but02">About this</span>

<div id="s1" class="hidden">
<div id="s2" class="hidden">

我需要使用JQuery从span id but01 / but02调用div id s1 / s2 hidden / show with onclick事件。

支持

Answer 1

有一个非常简单的解决方案：

$("#but01").click( function () {
  $("#s1").toggle();
});

演示：http://jsfiddle.net/tt36q/9/

Answer 2

试试这个：

$('span[id^="but0"]').click(function(){
    var id = $(this).attr('id').substr(4);
    if($('#s' + id).is(':visible'))
         $('#s' + id).hide();
    else
        $('#s' + id).show();
});

DEMO

Answer 3

这使用了on函数：

$("#but01").on('click', function () {
  $("#s1").toggle();
});