0

这可能是一个 Dum 错误，可以在几秒钟内修复，但一直在寻找一段时间，不知道如何使其工作

我基本上有这个代码`

  <!DOCTYPE html>
   <html>
   <head>
   <style>
   .box,
   button { float:left; margin:5px 10px 5px 0; }
   .box { height:80px; width:80px; background:#090; }
   #log { clear:left; }

   </style>
     <script src="http://code.jquery.com/jquery-latest.js"></script>
   </head>
   <body>

   <button id="btn1">fade out</button>
   <button id="btn2">show</button>

   <div id="log"></div>

   <div id="box1" class="box">linear</div>
   <div id="box2" class="box">swing</div>

   <script>
   $("#btn1").click(function() {
     function complete() {
       $("<div/>").text(this.id).appendTo("#log");
     }

     $("#box1").fadeOut(1600, "linear", complete);
     $("#box2").fadeOut(1600, complete);
   });

   $("#btn2").click(function() {
    $("div").show();
     $("#log").empty();
   });

   </script>

   </body>
   </html>

` 然后我想让它在 wordpress 中工作，所以我将样式移到 css 和 footer.php，如您在此处看到的

`

                <?php wp_enqueue_script("jquery"); ?>
                <script>
$("#btn1").click(function() {
function complete() {
$("<div/>").text(this.id).appendTo("#log");
}

$("#box1").fadeOut(1600, "linear", complete);
$("#box2").fadeOut(1600, complete);
});

$("#btn2").click(function() {
$("#box1").show();
$("#box2").show();
$("#log").empty();
});

</script>

`

http://testdomain.edgardoroldanonline.com/testpage/

但它不起作用我已经放置了 wp_enquenue 和所有我可以看到的潜在问题，比如对不同版本的 jquery 的干扰，但不知道是什么导致了问题，我唯一知道的是有一次我把行放在页面中html代码，它工作。直到可视化编辑器摆脱它

4

1 回答 1

1

你有一个javascript错误。

/testpage/:233 未捕获的类型错误：无法调用 null 的方法“单击”

你需要初始化 jQuery

jQuery(function(){
    jQuery("#btn1").click(function() {

        function complete() {
          jQuery("<div/>").text(this.id).appendTo("#log");
        }

        jQuery("#box1").fadeOut(1600, "linear", complete);
        jQuery("#box2").fadeOut(1600, complete);
    });

    jQuery("#btn2").click(function() {
    jQuery("#box1").show();
    jQuery("#box2").show();
    jQuery("#log").empty();
    });
});
于 2012-04-07T01:53:16.040 回答