1 javascript for more elements

-4

我用jQuery，html和css做了一個「分割觸發器」。我在我的Wordpress站點中使用插件embedit pro來保存html代碼，這樣我就可以輕鬆地在Wordpress編輯器中粘貼一個簡碼來顯示HTML。1 javascript for more elements

我做了5次HTML代碼，因爲我想有5個切換分區，現在的問題是，當我點擊應該切換相關分區的5個按鈕之一時，所有分區都會打開，而不是隻打開屬於我剛剛點擊的按鈕的一個部門。

我知道這是爲什麼，divs具有相同的名稱。我可以解決這個問題，使每個單獨的切換器都是唯一的，但是接下來我必須加載jquery 5次，是否有一種方法可以加載一次jquery腳本，並且可以切換屬於該按鈕的單個div？

我的jQuery代碼：

<script src="ajax.googleapis.com/ajax/libs/jquery/1.10.2/…; </script> 

<script> 
$(document).ready(function(){ 
    $(".flip").click(function(){ 
     $(".panel").slideToggle("slow"); 
    }); 
}); 
</script>

和HTML：

<div class="flip">Klik hier voor meer informatie.</div> 
<div class="blueline"></div> 
<div class="panel">Hier komt de informatie te staan over de hosting van Onderdelenhuishetanker.</div>

問候，

托馬斯。

來源

2014-02-20 thommylue

請提供一些代碼。 –

您不必加載jQuery 5次，__ever__。 – naththedeveloper

試試這個網址，如果它是完整的填寫您的期望比請上傳您的代碼。 http://jsfiddle.net/u3sns/5/ –

您應該在flip div中添加面板類，以便您可以選擇它的子項。

HTML：

<div class="flip">Klik hier voor meer informatie. 
    <div class="blueline"></div> 
    <div class="panel">Hier komt de informatie te staan over de hosting van Onderdelenhuishetanker.</div> 
</div>

的jQuery：

$(document).ready(function(){ 
    $(".flip").click(function(){ 
    $(this).find(".panel").slideToggle("slow"); 
    }); 
});

演示：JSFiddle

來源

2014-02-20 09:11:38

不，藍線必須不顯示切換。但是，謝謝你的回答，我希望應該有一種方式.. – thommylue

blueline將顯示不切換。 http://jsfiddle.net/d5xYM/2/ 這只不過是我沒有CSS藍色線，你可能有。我寫了一個快速的blueline css，以便您知道它不會與面板div切換。 –

感謝大家的幫助。大安你修好了，特別感謝你！ – thommylue

是的，有一種方法。你可能忘了使用選擇器$（this）。

$("div.class").click(function() { 

    $(this).toggle(); 
});

工作實例http://jsfiddle.net/qGeHe/

來源

2014-02-20 08:37:53 Kudlas

你是什麼意思？我對jquery的知識是零：D我應該顯示代碼嗎？ – thommylue

只需看看[示例]（http://jsfiddle.net/qGeHe/）我所做的。 – Kudlas

$（this）指您正在「工作」的元素。在這個代碼中：div.class。這意味着：當你點擊div.class（注意：所有的元素div有一個類名爲「class」），切換這個元素。 – enguerranws

你絕不會需要5 HTML或集成在您的網站的jQuery腳本。每個HTML文件都用於不同的頁面，您可以將div的5次複製。

jQuery有選擇正確的div的選擇器，id用於單選，class用於多選。

一旦你執行了click()函數，你不想再選擇所有的div，但只有你點擊的那個div。你可以簡單地使用$(this)來做到這一點。

你的代碼是這樣：

$("div.YOUR_CLASSNAME").click(function() { 
    $(this).toggle(); 
});

變化YOUR_CLASSNAME到類的div的名字。

來源

2014-02-20 08:49:05

對不起，我沒有說清楚。我的意思是，當我點擊一個div時，另一個切換的。我使用一個div，就像它是一個「按鈕」一樣，如下所示：http://staging.skyberate.nl/shared-hosting/magento-hosting/referenties/ – thommylue

1 javascript for more elements

回答

相關問題