JavaScript 未加载到 Wordpress 上

JavaScript not loaded on Wordpress

本文关键字：Wordpress 加载 JavaScript      更新时间：2023-09-26

我正在这个网站上工作（用Wordpress构建）。我正在尝试实现一个<script>来为表格设置动画。

具体来说，每次您将鼠标悬停在表格行上时，我需要在右侧显示不同的图片。

这是我正在使用的代码：

<script>
    $(document).ready(function(){
$('.row1').hover(function() {
  $('.one').toggle();
});
$('.row2').hover(function() {
  $('.two').toggle();
});
$('.row3').hover(function() {
  $('.tree').toggle();
}); 
$('.row4').hover(function() {
  $('.four').toggle();
}); 
$('.row5').hover(function() {
  $('.five').toggle();
});
$('.row6').hover(function() {
  $('.six').toggle();
});
$('.row7').hover(function() {
  $('.seven').toggle();
});
 $('.row8').hover(function() {
  $('.eight').toggle();
});
 $('.row9').hover(function() {
  $('.nine').toggle();
}); 
$('.row10').hover(function() {
  $('.ten').toggle();
});
$('.row11').hover(function() {
  $('.eleven').toggle();
});
$('.row12').hover(function() {
  $('.twelve').toggle();
}); 
$('.row13').hover(function() {
  $('.thirteen').toggle();
});     
$('.row14').hover(function() {
  $('.quattordici').toggle();
});    
 $('.row15').hover(function() {
  $('.quindici').toggle();
});    
 $('.row16').hover(function() {
 $('.sedici').toggle();
});
 $('.row17').hover(function() {
 $('.diciassette').toggle();
}); 
 $('.row18').hover(function() {
 $('.diciotto').toggle();
});  
 $('.row19').hover(function() {
 $('.diciannove').toggle();
});
 $('.row20').hover(function() {
 $('.venti').toggle();
});
 $('.row21').hover(function() {
 $('.ventuno').toggle();
}); 
$('.row22').hover(function() {
 $('.ventidue').toggle();
});   
$('.row23').hover(function() {
 $('.ventitre').toggle();
}); 
$('.row24').hover(function() {
 $('.ventiquattro').toggle();
});
$('.row25').hover(function() {
 $('.venticinque').toggle();
});
$('.row26').hover(function() {
 $('.ventisei').toggle();
});
$('.row27').hover(function() {
  $('.ventisette').toggle();
}); 
$('.row28').hover(function() {
  $('.ventotto').toggle();
});
$('.row29').hover(function() {
  $('.ventinove').toggle();
});
$('.row30').hover(function() {
  $('.trenta').toggle();
});
$('.row31').hover(function() {
  $('.trentuno').toggle();
});
$('.row32').hover(function() {
  $('.trentadue').toggle();
});
$('.row33').hover(function() {
  $('.trentatre').toggle();
});
$('.row34').hover(function() {
  $('.trentaquattro').toggle();
});
 $('.row35').hover(function() {
  $('.trentacinque').toggle();
}); 
$('.row36').hover(function() {
  $('.trentasei').toggle();
});
$('.row37').hover(function() {
  $('.trentasette').toggle();
});
$('.row38').hover(function() {
  $('.trentotto').toggle();
});
$('.row39').hover(function() {
  $('.trentanove').toggle();
});
$('.row40').hover(function() {
  $('.quaranta').toggle();
});
$('.row41').hover(function() {
  $('.quarantuno').toggle();
});
$('.row42').hover(function() {
  $('.quarantadue').toggle();
});
$('.row43').hover(function() {
  $('.quarantatre').toggle();
});
$('.row44').hover(function() {
  $('.quarantaquattro').toggle();
});
$('.row45').hover(function() {
  $('.quarantacinque').toggle();
});
$('.row46').hover(function() {
  $('.quarantasei').toggle();
});
$('.row47').hover(function() {
  $('.quarantasette').toggle();
});
$('.row48').hover(function() {
  $('.quarantotto').toggle();
});
$('.row49').hover(function() {
  $('.quarantanove').toggle();
});
$('.row50').hover(function() {
  $('.cinquanta').toggle();
});
$('.row51').hover(function() {
  $('.cinquantuno').toggle();
});
$('.row52').hover(function() {
  $('.cinquantadue').toggle();
});
$('.row53').hover(function() {
  $('.hause2_1').toggle();
});
$('.row54').hover(function() {
  $('.hause2_2').toggle();
});
$('.row55').hover(function() {
  $('.hause2_3').toggle();
});
$('.row56').hover(function() {
  $('.hause2_4').toggle();
});
$('.row57').hover(function() {
  $('.hause2_5').toggle();
});
$('.row58').hover(function() {
  $('.hause2_6').toggle();
});
$('.row59').hover(function() {
  $('.hause2_7').toggle();
});
$('.row60').hover(function() {
  $('.hause2_8').toggle();
});
$('.row61').hover(function() {
  $('.hause2_9').toggle();
});
$('.row62').hover(function() {
  $('.hause2_10').toggle();
});
$('.row63').hover(function() {
  $('.hause2_11').toggle();
});
$('.row64').hover(function() {
  $('.hause2_12').toggle();
});
$('.row65').hover(function() {
  $('.hause2_13').toggle();
});
$('.row66').hover(function() {
  $('.hause2_14').toggle();
});
$('.row67').hover(function() {
  $('.hause2_15').toggle();
});
$('.row68').hover(function() {
  $('.hause2_16').toggle();
});
$('.row69').hover(function() {
  $('.hause2_17').toggle();
});
$('.row70').hover(function() {
  $('.hause2_18').toggle();
});
$('.row71').hover(function() {
  $('.hause2_19').toggle();
});
$('.row72').hover(function() {
  $('.hause2_20').toggle();
});
$('.row73').hover(function() {
  $('.hause2_21').toggle();
});
$('.row74').hover(function() {
  $('.hause2_22').toggle();
});
$('.row75').hover(function() {
  $('.hause2_23').toggle();
});
$('.row76').hover(function() {
  $('.hause2_24').toggle();
});
$('.row77').hover(function() {
  $('.hause2_25').toggle();
});
$('.row78').hover(function() {
  $('.hause2_26').toggle();
});
$('.row79').hover(function() {
  $('.hause2_27').toggle();
});
$('.row80').hover(function() {
  $('.hause2_28').toggle();
});
$('.row81').hover(function() {
  $('.hause2_29').toggle();
});
$('.row82').hover(function() {
  $('.hause2_30').toggle();
});        
$('.row83').hover(function() {
  $('.hause2_31').toggle();
});
$('.row84').hover(function() {
  $('.hause2_32').toggle();
}); 
$('.row85').hover(function() {
  $('.hause2_33').toggle();
});
$('.row86').hover(function() {
  $('.hause2_34').toggle();
});
$('.row87').hover(function() {
  $('.hause2_35').toggle();
});
$('.row88').hover(function() {
  $('.hause2_36').toggle();
});
$('.row89').hover(function() {
  $('.hause2_37').toggle();
});
$('.row90').hover(function() {
  $('.hause2_38').toggle();
});
$('.row91').hover(function() {
  $('.hause2_39').toggle();
});
$('.row92').hover(function() {
  $('.hause2_40').toggle();
});
$('.row93').hover(function() {
  $('.hause2_41').toggle();
});
$('.row94').hover(function() {
  $('.hause2_42').toggle();
});
$('.row95').hover(function() {
  $('.hause2_43').toggle();
});
$('.row96').hover(function() {
  $('.hause2_44').toggle();
});
$('.row97').hover(function() {
  $('.hause2_45').toggle();
});        
});
</script>

没有结果。有什么提示吗？

没有结果

哦，我怀疑有结果。打开 Web 控制台，您可能在那里看到一条错误消息。:-)

默认情况下，Wordpress 调用 jQuery 的noConflict模式，你需要使用 jQuery 而不是 $ 来访问它。

jQuery的ready回调，你已经在使用，将向你传递对jQuery的引用作为第一个参数。您可以使用$作为参数名称，这意味着您只需将$(document)更改为jQuery(document)：

jQuery(document).ready(function($){
    $('.row1').hover(function() {
        $('.one').toggle();
    });
    // ...and so on...
});
相关文章：