1
首先，溫柔！我是javascript noob！回覆WordPress博文in Javascript功能
我已經創建了一個Codepen替換類，並通過javascript對元素單擊應用轉換。在Codepen環境中，它完美地工作。當我嘗試將相同類型的功能轉移到WordPress時，問題就出現了。
這裏原來的javascript：
$(document).ready(function(){
$("#panel-1 a.get-big").click(function(){
$("#panel-1").addClass("huge-panel");
$("div:not(#panel-1)").removeClass("huge-panel");
$("#panel-1 #the-top").addClass("move-in-top");
$("#panel-1 #the-bottom").addClass("move-in-bottom");
$("div:not(#panel-1 #the-top)").removeClass("move-in-top");
$("div:not(#panel-1 #the-bottom)").removeClass("move-in-bottom");
});
$("#panel-2 a.get-big").click(function(){
$("#panel-2").addClass("huge-panel");
$("div:not(#panel-2)").removeClass("huge-panel");
$("#panel-2 #the-top").addClass("move-in-top");
$("#panel-2 #the-bottom").addClass("move-in-bottom");
$("div:not(#panel-2 #the-top)").removeClass("move-in-top");
$("div:not(#panel-2 #the-bottom)").removeClass("move-in-bottom");
});
$("#panel-3 a.get-big").click(function(){
$("#panel-3").addClass("huge-panel");
$("div:not(#panel-3)").removeClass("huge-panel");
$("#panel-3 #the-top").addClass("move-in-top");
$("#panel-3 #the-bottom").addClass("move-in-bottom");
$("div:not(#panel-3 #the-top)").removeClass("move-in-top");
$("div:not(#panel-3 #the-bottom)").removeClass("move-in-bottom");
});
$("#panel-4 a.get-big").click(function(){
$("#panel-4").addClass("huge-panel");
$("div:not(#panel-4)").removeClass("huge-panel");
$("#panel-4 #the-top").addClass("move-in-top");
$("#panel-4 #the-bottom").addClass("move-in-bottom");
$("div:not(#panel-4 #the-top)").removeClass("move-in-top");
$("div:not(#panel-4 #the-bottom)").removeClass("move-in-bottom");
});
$("#panel-5 a.get-big").click(function(){
$("#panel-5").addClass("huge-panel");
$("div:not(#panel-5)").removeClass("huge-panel");
$("#panel-5 #the-top").addClass("move-in-top");
$("#panel-5 #the-bottom").addClass("move-in-bottom");
$("div:not(#panel-5 #the-top)").removeClass("move-in-top");
$("div:not(#panel-5 #the-bottom)").removeClass("move-in-bottom");
});
});
這不是優雅，但它是有效的。 Here it is on Codepen。
現在的問題和我迷路的地方。我想將其應用於WordPress自定義循環。 JavaScript中唯一需要的部分（我相信）是第一個引用＃panel-1的.click（函數）例程。在循環中，我使用php作爲div的id來引入post_ID。我需要找出一種方法，通過get_the_ID（）調用動態替換javascript內的panel-1的所有實例。從我在這裏和網絡上的其他地方收集到的所有信息中，我認爲這將使用wp_localize_script，但看着這隻會讓我感到困惑。
任何幫助，將不勝感激！