iT邦幫忙

0

jQuery小問題求助

http://jsfiddle.net/kimomai/BSpwU/
假設P的元素,我需要10個,或以上
在jQuery裡,是否有辦法以一個涵式
就能操作如小弟在jsFiddle的範例
按單一個CLICK按鈕,觸發單一原本P設置為display:none的事件

也就是說,以一個涵式便能操作所有的P元素
而不需多個涵式來操作
我有試過原本設置為隱藏的P元素以相同的Class命名
按下CLICK之後,隱藏的P元素卻全部都跑出來@_@

這該從哪方面著手?HTML的ID or Class?
或是jQuery本身就有語法可操作?或者得自行寫個plugin?
又,難道是CSS?小弟倒覺得不大可能

不知各位前輩能否看懂小弟的描述Q_Q
也煩請各位前輩不吝指教,感恩。

kimomai iT邦新手 5 級 ‧ 2013-05-23 17:59:39 檢舉
三位前輩都沒有會錯意
其效果都是小弟所要的

也正因為三位前輩答案都是我要的
小弟只好選第一位的解答為最佳
請後二位前輩多多包涵

程式這東西實在奇妙
人的思路各不同,相同的目的
也因人的思路不同,撰寫的程式也都各有巧妙

謝謝三位的解答,感恩Orz
2
葉宇霖
iT邦新手 4 級 ‧ 2013-05-23 03:23:59
最佳解答

http://jsfiddle.net/eden\_yeh/Xy6Py/2/

我不知道這是不是你要的效果
我大概說明一下我的作法

假設你的按鈕以及內容是一對一且有順序關係
我會先將每個<button>記錄他們本身的index關係
當觸發點擊事件的時候,再利用index去顯示/隱藏對應的內容

PS:我稍微改寫了html,先說聲不好意思

4
aqr199
iT邦新手 2 級 ‧ 2013-05-23 09:25:30
&lt;pre class="c" name="code">
$(function () {
    $('button[id^=a_]').click(function () {
        var Id = $(this).attr('id'); /*a_01*/
        var h1 = Id.substring(0,1); /*a*/
        var h2 = Id.substring(2,4); /*01*/
        $('p#'+h1+h2).slideToggle(); /*p#a01*/
    });
});
4
wllai2001
iT邦新手 5 級 ‧ 2013-05-23 10:22:17

完全不改HTML的情況下...

&lt;pre class="c" name="code">
$(function () {
    $('button[id^="a_"]').click(function () {
        $('p#'+this.id.replace("_","")).slideToggle();
    });
});

http://jsfiddle.net/wllai2001/7zsKd/

不知道有沒有會錯意?

我要發表回答

立即登入回答