Question

我尝试使用jQuery编写一个简单的show / hide div代码。基本上，当我点击.artist-ken时，我希望artists-home div消失，.ken-gallery替换它。

到目前为止，我有这个，但除了跳到页面顶部之外它没有做任何事情：

$('.artist-ken').click(function(){
    $('.artists-home').hide().show('ken-gallery');
});

Answer 1

试试这个：

$('.artist-ken').click(function(e){
    e.preventDefault();
    $('.artists-home').hide();
    $('.ken-gallery').show();
});

函数preventDefault()将停止跳转页面。您需要单独的show来显示另一个div。 .还缺少ken-gallery。

Answer 2

jQuery.show()没有将选择器作为第一个参数，请尝试这样做：

$('.artist-ken').click(function(){
    $('.artists-home').hide();
    $('.ken-gallery').show();
});

我假设您要隐藏的元素具有类＆＃34; .ken-gallery＆＃34;并且您要显示的元素具有类：＆＃34; .artists-home＆＃34;

Answer 3

$('.artist-ken').click(function(e){
    e.preventDefault();
    $(".artists-home").hide( 0, function() {
        $('.ken-gallery').show();
    });
});

Answer 4

试试这个

$('.artist-ken').click(function(e){
   e.preventDefault();
   $('.artists-home').hide();
   $('.ken-gallery').show();
});

您所做的并不是show()功能的真实参数。即使你没有指明它是一个类，即使它。它只能将函数，持续时间，任何内容或对象引用到 jQuery show reference page 您还可以创建一个单向监听器show或hide另一个

$(document).click(function(e){
   if( e.target.classList.contains('artists-home') ) {
       e.preventDefault();
       $(e.target).hide();
       $('.ken-gallery').show();
    }else if( e.target.classList.contains('ken-gallery') ){
       e.preventDefault();
       $(e.target).hide();
       $('.artists-home').show();
    }
});

Chonger说的是，如果你想要jQuery的任何show / hide和其他动画属性的淡出which is the duration parameter，那么我们将使用回调。所以我的单个函数监听器就会变成。

$(document).click(function(e){
   if( e.target.classList.contains('artists-home') ) {
       $(e.target).hide(500,function(){
       $('.ken-gallery').show();
       });
    }else if( e.target.classList.contains('ken-gallery') ){
      $(e.target).hide(500,function(){
       $('.artists-home').show();
       });
    }
});

修改重读你的问题，这些必须是页面的链接跳转到顶部所以我添加到功能。

Answer 5

Dude show()不能在（）括号中有参数，除了速度或动画方式如show（＆＃39;慢＆＃39;）或显示（＆＃39; 1000＆＃39;）仅有效。

您的语法错误

以下是有效的语法。这意味着，用class＆＃34; .artists-home＆＃34;并与班级一起展示＆＃34; .ken-gallery＆＃34;。

$('.artist-ken').click(function(){
    $('.artists-home').hide();
    $('.ken-gallery').show();
});

了解更多信息show

显示/隐藏jQuery函数不起作用

5 个答案: