JQuery下拉菜单不适用于wordpress WooCommerce商店页面

时间:2017-05-11 21:24:24

标签: javascript jquery html wordpress woocommerce

我试图为我的Wordpress商店(WooCommerce)创建一个简单的下拉菜单 - https://shop.sin.org.pl/sklep/

问题是,当下拉菜单显示时,它应该返回的图像不会。有谁知道如何强制在下拉列表旁边显示它?

代码: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>

1 个答案:

答案 0 :(得分:1)

您应该在WordPress中使用jQuery()而不是$()

这也可能与Firebug中针对该页面出现的大量错误有关。