2017-05-11 113 views
0

我想爲我的WordPress的商店(WooCommerce) - https://shop.sin.org.pl/sklep/做一個簡單的下拉菜單。JQuery下拉菜單不工作在WordPress的WooCommerce商店頁面

問題是,雖然下拉菜單顯示,但它應該返回的圖像不會。有誰知道如何強制顯示它旁邊的下拉?

代碼:https://pastebin.com/2ZcyKAh8

<!DOCTYPE html> 
<html lang="en"> 
<head> 
<meta charset="utf-8"> 
<title>Testy</title> 
<style type="text/css"> 
    .box{ 
    color: #000000; 
    padding: 0px; 
    display: none; 
    margin-top: 0px; 
    background-color: #ffffff; 
    text-align: center; 
} 

</style> 
<script type="text/javascript" src="http://code.jquery.com/jquery.min.js">   </script> 
<script type="text/javascript"> 
$(document).ready(function(){ 
$("select").change(function(){ 
    $(this).find("option:selected").each(function(){ 
     var optionValue = $(this).attr("value"); 
     if(optionValue){ 
      $(".box").not("." + optionValue).hide(); 
      $("." + optionValue).show(); 
     } else{ 
      $(".box").hide(); 
     } 
    }); 
}).change(); 
}); 
</script> 
</head> 
<body> 
<div> 
    <select> 
     <option>Wybierz substancje</option> 
     <option value="1">LSD</option> 
    </select> 
</div> 
<div class="1 box"> 
    <a href="http://sin.org.pl" target="_blank"> 
     <img src="https://s14.postimg.org/s15q8k3u9/Untitled-1.jpg" /> 
    </a> 
</div> 
</body> 
</html> 
+0

在那個頁面上有太多的jQuery錯誤,我不知道從哪裏開始。您是否使用Firebug或瀏覽器內置的調試/ dom工具? –

+0

Wordpress和Woocommerce ...我實際上可以編輯的代碼就是我在這裏粘貼的代碼。 – user3158006

+0

該代碼的作品,應該優化,但工程...你能澄清這個問題嗎? – brasofilo

回答

1

您應該使用jQuery()在WordPress

$()這也可能涉及到錯誤的顯示出來螢火蟲該頁面的數量巨大。

+1

天才。獎勵!這個簡單的修復很快,爲我節省了大量的時間。 – user3158006

+0

@ user3158006你真的應該使用某種形式的開發工具。 Firebug通常被認爲是最好的。你的一些jQuery沒有加載,因爲它是通過http加載而不是https加載的。您應該添加一個htaccess規則來強制所有通過https。 –