前綴+和 - 使用jquery

的div我有jQuery的手風琴這樣的腳本..前綴+和 - 使用jquery

<script type='text/javascript'> 
$(document).ready(function() { 
    $('div.Syb> div').hide(); 
    $('div.Syb> h4').click(function() { 
    $(this).next('div').slideToggle('fast') 
    .siblings('div:visible').slideUp('fast'); 
    }); 
}); 
</script>

我需要顯示+和 - ..to顯示，其展開和摺疊的DIV之前符號..

我該怎麼做。

來源

2010-06-18 Hacker

如果你沒有大驚小怪有關Internet Explorer 7或更低，那麼您可以在CSS做到這一點，這是它應該是理想的（因爲它是展示，而不是內容）：

div.Syb> div:before 
{ 
    content: '+'; 
} 
div.Syb> div.hidden:before 
{ 
    content: '-'; 
}

或者你可以玩背景圖片。

然後只是簡單地使用toggleClass()給你的div一個隱藏的類。

如果你想做到這一點在直線上升的jQuery，你可能不得不改變你的標記一點：

<div class="Syb"> 
    <h4><span>+</span>Title One</h4> 
    <div id="one">Text</div> 
    <h4><span>+</span>Title Two</h4> 
    <div id="two">Text</div> 
    <h4><span>+</span>Title Three</h4> 
    <div id="three">Text</div> 
</div>

然後你就可以簡單地改變你的jQuery這樣：

<script type='text/javascript'> 
$(document).ready(function() { 
    $('div.Syb> div').hide(); 
    $('div.Syb> h4').click(function() { 
     var span = $(this).children('span:first'); 
     span.text(span.text()=='+'?'-':'+'); 
     $(this).next('div').slideToggle('fast') 
      .siblings('div:visible').slideUp('fast'); 
    }); 
}); 
</script>

來源

2010-06-18 16:10:10 Keithamus

感謝兄弟..這對我工作..我需要了解的代碼..什麼是兒童（'跨：第一'）;做什麼？ – Hacker 2010-06-18 16:33:07

當然！ Children（http://api.jquery.com/children/）搜索調用它的元素的子元素（在這裏定義爲'span'），在這個例子中是H4，所以它說：「裏面的所有SPAN標籤H4標籤「。第一個（http://api.jquery.com/first-selector/）是一個僞選擇符，簡單地說「元素列表中的第一個」，這意味着您可以在H4內部擁有多個SPAN標籤，第一個會受到影響。裏面的span.text是一個速記條件語句，你可以在這裏閱讀更多：http：//www.scribd.com/doc/1026312/Javascript-Shorthand-QuickReference – Keithamus 2010-06-18 18:29:59

感謝您的美麗的解釋 – Hacker 2010-06-19 06:42:53

前綴+和 - 使用jquery

回答

相關問題