面临困难控制一个可见的div将隐藏和隐藏的div将可见使用jquery

我有两个div div可见，另一个隐藏。上点击可见的div将隐藏的和不可见的div将是可见的代码如下：面临困难控制一个可见的div将隐藏和隐藏的div将可见使用jquery

CSS

.hide_div{ 
visibility:hidden; 
} 
.show_div{ 
visibility:visible 
}

的Jquery：

function hideandshow(){ 
$(document).ready(function(){ 
    if ($('#hide').is(':visible')) { 
    $("#hide").removeClass('show_div'); 
    $("#hide").css('visibility', 'hidden'); 
    }; 
    if ($('#show').is(':hidden')) { 
    $("#show").removeClass('hide_div'); 
    $("#show").css('visibility', 'hidden'); 
    }; 
    };

HTML

<div id="hide"><input type="text" name="id" value="1" onclick="hideandshow()" /></div> 
    <div id="Show" class="hide_div"><input type="text" name="id" value="3" /></div>

请帮助我如何解决这个难题。

来源

2014-10-31 Apache

而不是使用CSS属性的使用jQuery方法show()和hide()一样，

$('#hide').click(function(){ 
    if ($('#hide').is(':visible')) { 
     $("#hide").hide(); 
    }; 
    if ($('#Show').is(':hidden')) { 
     $("#Show").show(); 
    }; 
});

HTML

<div id="hide"><input type="text" name="id" value="1" /></div> 
<div id="show" style="display: none;"><input type="text" name="id" value="3" /></div>

而且你的代码不看语法正确，你没有关闭$(document).ready()正确，它是在其他功能。此外，您还没有在您的问题中提到要绑定onclick事件的元素。

UPDATE

你在你的代码中的错字，你的div id为 '显示' 和你在你选择用 '秀'，

$("#show").css('visibility', 'hidden');

DEMO FIDDLE

来源

2014-10-31 09:10:50 VPK

尝试这个：因为:visible选择器在这里不起作用，因为带有visibility: hidden或opacity: 0的元素被视为可见，请检查此链接:visible和相同的值NG适用于:hidden

if ($('#hide').css('visibility') == 'visible') { 
    $("#hide").removeClass('show_div'); 
    $("#hide").css('visibility', 'hidden'); 
} 

if ($('#Show').css('visibility') == 'hidden') { 
    $("#Show").removeClass('hide_div'); 
    $("#Show").css('visibility', 'visible'); 
}

你的函数定义并不需要的$（document）附上使用上面的代码可见格被隐藏，但在同一时间隐藏格设置不可见。就绪

来源

2014-10-31 09:15:14

。请告诉我更多.... – Apache 2014-10-31 09:24:32

请确保您的id选择器与元素id属性相同，因为我使用了'＃show'，但在您的示例中应该是大写而不是'＃show'，它应该是'＃＃ Show' – 2014-10-31 09:30:53

面临困难控制一个可见的div将隐藏和隐藏的div将可见使用jquery

回答

相关问题