jQuery的 - 是指另一個類同一對象的

我有一個網站，將覆蓋4個不同的主題。我從4個div開始，每個div都有這些主題的標題。例如，

<div><p> Physics </p></div> 
<div><p> Chemistry </p></div> 
<div><p> Biology </p></div> 
<div><p> Math  </p></div>

當我點擊「物理」 DIV，我想另一個div來出現的一些物理問題什麼的闡述。另一次點擊會導致'精化div'消失。我已經得到了一個「對象」是在這裏工作：

http://jsfiddle.net/yfrNn/2/

這是我使用做到這一點jQuery代碼。

$(document).ready(function() { 
    $(".phys").click(function() { 
     if ($(".phys:last").css("visibility") == "visible") { 
      $(".phys").css("visibility", ""); 
     } else { 
      $(".phys").css("visibility", "visible"); 
     } 
    }); 
});`

我可以寫這個函數4次不同的時間，一次爲我使用的每個主題，但希望一個更乾淨的解決方案。我想知道我是否可以宣佈所有的div以下方式：

<div class="subject phys"><p> Physics </p></div> 
<div class="subject chem"><p> Chemistry </p></div> 
<div class="subject bio"><p> Biology </p></div> 
<div class="subject math"><p> Math  </p></div>

然後有一定的點擊（）函數運行每次單擊「對象」 DIV，有代碼識別哪些學科這一特定div指的是，並顯示適當的「精心製作div」。

我相信我可能有子類做到這一點：

/* CSS */ 
div.subject{} 
.subject.phys{} 
.subject.chem{} 
.subject.bio{} 
.subject.math{}

有什麼想法？有沒有明顯更好的方式來實現這樣的事情？

編輯

這裏有一個更新的小提琴，用HTML大概因爲這將是在執行：

http://jsfiddle.net/yfrNn/6/

來源

2013-10-21 Ryan Tuck

你可以，但它會更好，而不是使用一個數據屬性在我看來是用來存儲目標附加內容元素而不是一個類，這樣你就不必通過標題元素的classNames進行解析或者擁有一個if elseif elseif語句。或者，更好的辦法是使用錨標籤，因爲這確實是一個單擊事件，並將目標元素的id存儲爲錨的href。 –

您可以發佈您將使用的實際HTML，包括次要文本嗎？ – j08691

剛剛發佈了一個包含html的新小提琴 –

$('.subject').click(function(e){ 
e.stopPropagation(); 
e.preventDefault(); 

//use a specific class name like `insideDiv` for the divs that are inside your main ones instead of div.another below 

if ($(this).find('div.another').is(":visible")) 
{$(this).find('div.another').hide();} 
else 
{$(this).find('div.another').show();} 
});

來源

2013-10-21 20:56:31 Victor

jQuery的 - 是指另一個類同一對象的

回答

相關問題