的Click＆只顯示如果有一個現有的div類

我的老問題：One Page fadeIn & fadeOut Transition Logic 的Click＆只顯示如果有一個現有的div類

代碼工作不錯，但我有一個問題。在我的導航系統中有菜單的子菜單，又名下拉菜單。因此，如果點擊沒有內容的菜單鏈接，但是子菜單，則內容頁面將被加載爲空，直到我點擊實際上具有內容類的內容爲止。

下面是一個簡單的jsfiddle例如：http://jsfiddle.net/QuKhN/1/

我希望它加載的內容，只要有相應的菜單鏈接標識的內容。所以如果在這個例子中點擊「聯繫我們」，我不希望它加載一個名爲「contactus content」的不存在的div。

這可能嗎？我已經嘗試了一些hasClass（）函數的東西，但我沒有成功。

感謝您花時間閱讀和理解。

來源

2012-07-07 Tumay

你可以試試這個：

$("ul li a ").click(function() { 
    var cls = $(this).attr('id') 
    if ($('div.content.' + cls).length > 0) { 
     $(".content").fadeOut(500); 
     $('.' + cls).delay(500).fadeIn(1000); 
    } 
    return false; 
})

DEMO

來源

2012-07-07 11:12:15 undefined

謝謝你，這工作最好:)就像我想要的那樣。 – Tumay 2012-07-07 11:38:05

您可以選擇您即將顯示的元素並使用length屬性來確保存在這樣的元素。長度將大於零。

事情是這樣的：

$("ul li a ").click(function(){ 
    var cls = $(this).attr('id'); 
    // Fade out the previous content no matter what 
    $(".content").fadeOut(500); 
    // Check if there is content to display using length 
    if ($('.' + cls).length > 0) { 
     // Will only display content if it exist 
     $('.' + cls).delay(500).fadeIn(1000); 
    } 
    return false; 
});

這裏是一個工作示例：http://jsfiddle.net/QuKhN/2/

注：

這依賴於你沒有一些其他的元素使用這些類，但腳本的其餘部分也是這樣，所以我想在這種情況下可以。

來源

2012-07-07 11:09:35

感謝您的解釋，真讚賞它。我不知道爲什麼，但它在我的網站上不起作用，儘管它與我的問題中給出的結構一致。一定是我的壞，對不起。 – Tumay 2012-07-07 11:39:13

嘗試hasClass：

$("ul li a ").click(function(){ 
    var cls = $(this).attr('id') 
    $(".content").fadeOut(500); 
    if($("div").hasClass(cls)){ 
     $('.' + cls).delay(500).fadeIn(1000); 
    } 
    return false; 
})

來源

2012-07-07 11:10:24 mgraph

謝謝，聽起來不錯，但我無法讓它工作「完美」感謝你的努力！ – Tumay 2012-07-07 11:49:19

$("ul li a").filter(function(){ 
    return $('.'+this.id).length>0; 
}).click(function(){ 
    var cls = $(this).attr('id') 

    $(".content").fadeOut(500); 
    $('.' + cls).delay(500).fadeIn(1000); 
    return false; 
})

DEMO

來源

2012-07-07 11:13:25 Engineer

對不起，我不能嘗試你的解決方案，我正在嘗試其他的，只是看到你的，但非常感謝你！ – Tumay 2012-07-07 11:50:33

@Tumay有一個演示，你可以看到。 – Engineer 2012-07-07 11:51:30

的Click＆只顯示如果有一個現有的div類

回答

相關問題