依赖于.toggle的JavaScript2元素

Question

嗨，我有两个JavaScript元素来登录和创建一个帐户。当单击div id时，它们彼此重叠，我需要它们在单击另一个id时隐藏，反之亦然。

<script type="text/javascript">
jQuery(document).ready(function(){
    jQuery('#sign-in').live('click', function(event) {        
         jQuery('#login-content').toggle();
    });
});
jQuery(document).ready(function(){
    jQuery('#create-account').live('click', function(event) {        
         jQuery('#create-content').toggle();
    });
});
</script>

Answer 1

因为您想让它们交替使用，最简单的方法是使用show()和hide()，而不是toggle()，因为如果多次单击登录，实际上不希望切换可见性，所以希望它始终显示#登录并隐藏#create。还请注意，live()函数已被取消，以支持on()。参见此示例：

jQuery(document).ready(function(){
    jQuery('#sign-in').on('click', function(event) {        
         jQuery('#login-content').show();
         jQuery('#create-content').hide();
    });
    jQuery('#create-account').on('click', function(event) { 
         jQuery('#create-content').show();       
         jQuery('#login-content').hide();  
    });
});