簡體   English   中英

jQuery-如果單擊父類,則切換圖像Src隱藏/顯示

[英]Jquery - Toggle Image Src if Parent Class is Clicked Hide/Show

我有一個配置為單擊+/-圖標時隱藏/顯示表行的程序。 該功能正在運行,但是,當父類別切換為關閉狀態時,我需要找出一種重置所有隱藏/顯示圖標的方法。

$(function(){
//src vars
var hide_src = "http://www.synchronizeddesigns.com/filter_hide.gif",
    reveal_src = "http://www.synchronizeddesigns.com/filter_reveal.gif",
        s = '';
//hide all sublevel elements
$(".subsub, .subsubsub").hide();

$("a").click(function(e){
    e.preventDefault();
    var tID = e.target.id,
        tClass = '.' + tID.replace('HS', '');

    $(tClass).toggle();

    if(!$(tClass).is(':visible')){
        s = hide_src;

        //for each subcategory
        $(tClass).each(function(){
            //get class names into classes array
            var classes = $(this).attr('class').split(' '),
                parentClass = '';

            //search classes array for class that begins with 'cat'
            for (var j=0; j<classes.length; j++) {
                if (classes[j].match("cat")){ 
                    parentClass = classes[j];
                }
            }

            //find subsubsub elements that have a class that begins with 'cat#sub'
            var subs = $('[class*=' + parentClass + 'sub]');

            //if there are sub elements, hide them too
            if(subs){
                subs.hide();

                /*****************************************************
                NEED HELP HERE !!!!!!!!!!
                Need a way to reset all hide/show images icon
                when 'parentClass' hide/show is clicked to close.
                *****************************************************/

            }
        });
    } else {
        s = reveal_src;
    }
    //Change image src
    $("#" + tID).attr('src', s);
});
});

復制:切換打開所有父項和子項,然后關閉其中一個父項,然后重新打開父項。 您會注意到+/-圖標保持其以前的狀態

jsFiddle鏈接

您可以找到當前子類別下的img節點,然后更改其src屬性。

我已經更新了您的jsfiddle: http : //jsfiddle.net/nTyWv/12/

代碼可能類似於:

            if(subs){
                innerIcons = jQuery.find("a > img[id*="+tID+"sub]");
                if (innerIcons) {
                    $(innerIcons).attr('src', s);
                };
                subs.hide();
            }

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM