Jquery 显示/隐藏不起作用
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/2323833/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Jquery show/hide not working
提问by Andrew
I have this jquery script which suppose to hide/show div element base on the hyperlink that is clicked. I don't know why but it's not working at all. The following is the except of my code.
我有这个 jquery 脚本，它假设根据单击的超链接隐藏/显示 div 元素。我不知道为什么，但它根本不起作用。以下是我的代码除外。
function hide_current_commoncontainer(commoncontainer){
$(commoncontainer).each(function(){
if(this.is(":visible")){this.hide();}
});
}
function init(){
$("#compose_link").bind("click",function(){
hide_current_commoncontainer(".pmcommoncontainer");
("#composer").show();
return false;
}
);
if(Drupal.jsEnabled){
$(document).ready(init);
}
I've pinpoint the cause and found out that it is show/hide function which is not working. The rest - function calls - are ok. Can anyone tell me where I am doing wrong? Where should I amend my code in order to hide/show div element as the way I wanted.
我已经查明原因并发现它是显示/隐藏功能不起作用。其余的 - 函数调用 - 没问题。谁能告诉我我哪里做错了？我应该在哪里修改我的代码以按照我想要的方式隐藏/显示 div 元素。
回答by Andrew
Ok I found out why $("#composer").show() is not working. It's because I hard-coded the visibility style of those divs to "hidden" and jquery's "show" method can't revert that. Strangely, as opposed to "show" method, "hide" can revert hard-coded "visible" style with no problem. So, to hide/show elements as intended, I either have to use hide/show method combo without no visibility style hard-coding or use css method of jquery and set the visibility style as desire.
好的，我发现了为什么 $("#composer").show() 不起作用。这是因为我将这些 div 的可见性样式硬编码为“隐藏”，而 jquery 的“显示”方法无法还原。奇怪的是，与“显示”方法相反，“隐藏”可以毫无问题地恢复硬编码的“可见”样式。因此，要按预期隐藏/显示元素，我要么必须使用没有可见性样式硬编码的隐藏/显示方法组合，要么使用 jquery 的 css 方法并将可见性样式设置为所需。
回答by psychotik
You're missing the $before ("#composer").show();and this
你错过了$之前("#composer").show();和this
Shouldn't it be $("#composer").show();and $(this)? Also, make sure you've pulled in the definitions of show/hide
不应该是$("#composer").show();和$(this)吗？另外，请确保您已经提取了show/hide
回答by Khanzor
I'd suggest you do something like
我建议你做类似的事情
$(function() {
$('#compose_link').click(function(e) {
$('.pmcommoncontainer').children(':visible').hide();
$('#composer').show();
e.preventDefault();
});
});
Which will show the element with the id of composer, and hide all visible child elements of the class pmcommoncontainer when the element with the id compose_link is clicked.
这将显示具有 composer id 的元素，并在单击 id 为 compose_link 的元素时隐藏类 pmcommoncontainer 的所有可见子元素。
I think this is what you want to do - no need to iterate as jQuery works with sets :).
我认为这就是您想要做的 - 无需在 jQuery 与集合一起使用时进行迭代:)。
EDIT
编辑
Looks like you also wanted the click or post to be stopped - with events you can use the preventDefault() function to stop that behaviour.
看起来您还希望停止点击或发布 - 对于事件，您可以使用 preventDefault() 函数来停止该行为。
回答by RSolberg
I think that there are a couple of areas that need to be tweaked in your code sample.
我认为您的代码示例中有几个方面需要调整。
REPLACE
代替
("#composer").show();
WITH
和
$("#composer").show();
REPLACE
代替
if(this.is(":visible")){this.hide();}
WITH
和
if($(this).is(":visible")){$(this).hide();}
回答by barefootcoder
jQuery's show() and hide() methods don't work on the CSS visibilty attribute. The effect can be achieved by using the css() function instead.
jQuery 的 show() 和 hide() 方法不适用于 CSS 可见性属性。可以通过使用 css() 函数来实现效果。
Change your code to
将您的代码更改为
$(#composer).css('visibility', 'visible');
$(#composer).css('visibility', 'visible');
And
和
if($(this).is(":visible")){$(this).css('visibility', 'hidden');}
if($(this).is(":visible")){$(this).css('visibility', 'hidden');}
回答by helloandre
instead of this, you have to use $(this)for jquery objects.
而不是this，您必须使用$(this)jquery 对象。
