jQuery小問題求助

kimomai 2013-05-22 22:45:05 ‧ 2211 瀏覽

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 檢舉

三位前輩都沒有會錯意
其效果都是小弟所要的

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

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

謝謝三位的解答，感恩

登入發表討論

直播研討會

{{ item.channelVendor }} {{ item.webinarstarted }} |

直播中

3 個回答

葉宇霖

iT邦新手 4 級 ‧ 2013-05-23 03:23:59

最佳解答

http://jsfiddle.net/eden_yeh/Xy6Py/2/

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

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

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

回應
分享
檢舉

登入發表回應

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*/
    });
});

回應
分享
檢舉

登入發表回應

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/

不知道有沒有會錯意?