回覆帖子

-4

我想動態地編寫HTML代碼來切換包含它的div（post）的回覆文本框。這正成爲一種負擔，因爲我使用PHP來動態輸出每個div（post）並且不能將每個回覆按鈕與每個div唯一鏈接。回覆帖子

jQuery的

$("#reply").click(function(){ 
    $("#box").toggleClass("hidden"); 
});

CSS

.hidden{ 
    display: none; 
}

只有的第一個職位的作品。

來源

2012-12-25 Monstrum

你聲明'只有箱子在第一個帖子上可見'。應該看到多少個盒子？你正在使用'id'選擇器，'$（「＃box」）'，所以它應該只使用id =「box」'1的方框可見。 – Sean

那麼，如果你使用ID，你的目標是特定的元素..或者你需要類，或者你給不同的元素相同的ID，這是錯誤的 –

你不能有一個功能，打開一個特定的ID盒子，並認爲它會附加到所有箱子 – jtheman

首先，如果你有每個div的回覆按鈕，那麼你應該真的在使用類。

id對於每個頁面都應該是唯一的，而另一方面類別被設計爲具有多個實例。

所以發生了什麼是你的jQuery選擇器，$("#reply")找到第一個#reply並在那裏停下來。您的$("#box")選擇器也一樣。切換你的#reply s和#box es有一個類，例如。 <div class="reply">，然後使用選擇器$(".reply")。您也會遇到與您的#box相同的問題。

沒有一個HTML的例子，我不能真正建議你在這裏做的最好的事情。但這裏是一個通用的解決方案：

JS小提琴
http://jsfiddle.net/Nveea/

HTML

<div id="reply-1" class="reply">Reply</div>` 
<div id="box-1" class="box">box 1</div> 
<hr /> 
<div id="reply-2" class="reply">Reply</div> 
<div id="box-2" class="box">box 2</div>

CSS

.box 
{ 
    display:none; 
}

的JavaScript

$(".reply").click(function(){ 
    //get the associated box 
    var index = $(this).attr("id").replace("reply-",""); 

    //toggles show and hide 
    $("#box-" + index).toggle(); 
});

將上述溶液假設使用的是某種在PHP for循環，並且可以插入迭代索引到每個reply和box元件。如果您提供一些HTML示例，則可以提供更好的解決方案。

我還將只是建議使用jQuery功能toggle()，其切換的元件/要素，並從顯示：隱藏/塊。這可能比.toggleClass（「隱藏」）更好。

來源

2012-12-25 08:51:15 Jace

thanx很多，我真的很感激 – Monstrum

@ Mr.DeveloperWaseem沒問題！如果這可以幫助你，請註冊並考慮將其標記爲答案。 – Jace

我的回答稍微改進了一點，它仍然是一樣的，但包含了JSFiddle的代碼片段。 – Jace

雖然創建按鈕給編號&一個類，每個按鈕的方式，當你點擊你應該能夠得到該ID。寫一個函數：

$(".class").live("click",function(){ 
    var id=$(this).attr('id'); 
    $(id).insertAfter($("#box").show()); 
});

來源

2012-12-25 08:55:55 sandip

回答

相關問題