Question

我有一个功能可以在点击时切换内容。

jQuery("#about_temp").click(function($){
    document.getElementById('con_temp').style.display='block';
    document.getElementById('keyc_temp').style.display='none';
    document.getElementById('benec_temp').style.display='none';
});

此代码中是否存在语法错误？它并没有隐藏＆＃34; con_temp＆＃34;内容。但是如果我在普通的HTML中运行相同的（我的意思是不在Wordpress中），它运行正常。

Answer 1

您可以使用以下脚本

jQuery("#about_temp").click(function($){
    jQuery('#con_temp').show();
    jQuery('#keyc_temp, #benec_temp').hide();
});

Answer 2

我认为您在代码中的错误是 - jQuery("#about_temp").click(function($){...}); - 尝试将其更改为 - $("#about_temp").click(function() {...})

$("#about_temp").click(function() {
    document.getElementById('con_temp').style.display='block';
    document.getElementById('keyc_temp').style.display='none';
    document.getElementById('benec_temp').style.display='none';
});

如果您使用的是Jquery，那么使用Jquery方法（hide和show）比使用Javascript更容易。

试试这个---

$("#about_temp").click(function() {
    $('#con_temp').show();
    $('#keyc_temp, #benec_temp').hide();
});

提供隐藏和显示hide("slow")或show("slow")的参数将为内容带来动画效果。

Answer 3

您可以尝试：

jQuery(function(){
     jQuery("#about_temp").click(function(){
        jQuery("#con_temp").show();             //  jQuery("#con_temp").css("display","block");
        jQuery("#keyc_temp").hide();            //  jQuery("#keyc_temp").css("display","none");
        jQuery("#benec_temp").hide();           //  jQuery("#benec_temp").css("display","none");
    })
})

如果您的网页HTML动态生成或发生任何事件后，请尝试使用on

jQuery(function(){
    jQuery("body").on("click","#about_temp",function(){
        jQuery("#con_temp").show();              //  jQuery("#con_temp").css("display","block");
        jQuery("#keyc_temp").hide();            //  jQuery("#keyc_temp").css("display","none");
        jQuery("#benec_temp").hide();            //  jQuery("#benec_temp").css("display","none");
    })
})

的document.getElementById（＆＃39;＆＃39）。将style.display =＆＃39;块＆＃39 ;;不能在Wordpress

3 个答案: