2017-05-11 75 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。 –