jquery hide /显示

嗨每1我有一个问题，在我的jquery我想这调整此cods能够隐藏图像/文本时页面打开，这意味着什么都没有出现，当我打开页面时只有按钮，当我点击它的图像/文字出现，我想要什么可以帮助我？jquery hide /显示

<html> 
<head> 

<script type="text/javascript"> 

function show_menu(id){ 
    document.getElementById(id).style.display = "block"; 
    } 

function hide_menu(id){ 
    document.getElementById(id).style.display = "none"; 
    } 


</script> 
</head> 


<body> 

<button onclick="if (document.getElementById('idOfDiv').style.display=='none') show_menu('idOfDiv'); else hide_menu('idOfDiv');">Show/Hide</button> 

<div id="idOfDiv"> 
    <img src="http://mybroadband.co.za/photos/data/500/apple-logo.jpg"/> 
    text text text text text text text text text....</div> 
</body> 
</html>

来源

2012-02-24 Ahmet agha

当页面加载时应该隐藏，当你点击按钮时，它应该显示..多数民众赞成你想要的？ – 2012-02-24 12:11:32

删除了'java'标记。 Java对Javascript来说，那就是Car Carpet。完全不相关。 – Curt 2012-02-24 12:15:01

他们有什么共同点，就是大量的Java消耗在开发它们;） – mindandmedia 2012-02-24 12:16:47

使用jQuery这可以在一个函数来完成：

<script type="text/javascript"> 

function showhide_menu(id){ 
    $("#" + id).toggle(); 
} 

</script> 

<button onclick="showhide_menu('idOfDiv');">Show/Hide</button> 

<div id="idOfDiv" style="display:none;"> 
    <img src="http://mybroadband.co.za/photos/data/500/apple-logo.jpg"/> 
    text text text text text text text text text....</div>

来源

2012-02-24 12:13:44 Curt

谢谢你这是非常好的，但你没有解决我的问题，当我打开页面没有什么只显示按钮，当我点击按钮，我可以显示或隐藏它再:) :) – 2012-02-24 12:37:40

@Ahmetağa - 我已经做了修改，以包括'div'与'display：none'来隐藏加载元素。 – Curt 2012-02-24 12:39:30

谢谢你现在很好，很简单，但哪一个黄油网站鳕鱼或尼古拉Peluchetti或dku.rajkumar所有你给我一个不同的鳕鱼和所有这些鳕鱼工作，因为我想，但哪一个最好的网站？ ??? – 2012-02-24 20:45:05

你可以做（使用jQuery作为你的要求）

$(document).ready(function(){ 
    $('#idOfDiv').hide(); 
    $('button').click(function(){ 
    var idOf = $('#idOfDiv'); 
    if(idOf.is(':visible')){ 
     idOf.hide(); 
    }else{ 
     idOf.show(); 
    } 
    }); 
});

HTML

<body> 

<button >Show/Hide</button> 

<div id="idOfDiv"> 
    <img src="http://mybroadband.co.za/photos/data/500/apple-logo.jpg"/> 
    text text text text text text text text text....</div> 
</body>

来源

2012-02-24 12:12:44

身体呢？ – 2012-02-24 12:24:36

thaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaank youuuuuuuuu finaly :) – 2012-02-24 12:51:09

不错的解决方案，但使用toggle（）函数在我看来好多了。例如@Curt – Neysor 2012-02-24 14:14:22

您可以使用jQuery的.toggle()。

HTML

<div id="idOfDiv" style="display:none;"> 
    <img src="http://mybroadband.co.za/photos/data/500/apple-logo.jpg"/> 
    text text text text text text text text text....</div>

的JavaScript

$("#btn").click(function(e) { 
    $("#idOfDiv").toggle(); 
});

演示上jsFiddle。

希望这可以帮助你。

来源

2012-02-24 12:13:32

改变这一点，隐藏在页面加载

<div id="idOfDiv" style="display:none;">

jQuery的

<script type="text/javascript"> 
$(document).ready(function(){ 
    $('button').click(function(){ 
    $('#idOfDiv').toggle(); 
    }); 
}); 
</script>

来源

2012-02-24 12:13:46

谢谢你它是好的，但按钮的工作只显示我想要显示和隐藏;） – 2012-02-24 12:49:25

多数民众赞成是我的不好...更新..我也知道它也是迟到:) – 2012-02-24 14:42:12

哇非常好的鳕鱼与美丽的工作，现在我喜欢.toggle（）这是好现在我知道什么是.toggle做谢谢你:) 我有另一个问题我该如何添加你作为一个朋友在这个网站我在这里是新的倪想要朋友互相帮助 – 2012-02-24 15:59:27

你不显得使用jquery，因为如果你愿意，你的代码看起来更像这样：

<a href='#' class='action'>Show/Hide</a> 
<div id="idOfDiv" style='display:none'> 
    <img src="http://mybroadband.co.za/photos/data/500/apple-logo.jpg"/> 
    text text text text text text text text text....</div> 

$(document).ready(function(){ 
    $('.action').click(function(){$('#idOfDiv').toggle();}); 
});

来源

2012-02-24 12:13:58 mindandmedia

使用jQuery肘节（）http://api.jquery.com/toggle/

HTML：

<html> 
<head> 
    <script src="http://code.jquery.com/jquery-latest.js"></script> 
</head> 
<body> 
    <button>Toggle</button> 
<p id="hi">Hello</p> 
</body> 
</html>

JQUERY：

$("button").click(function() { 
    $("#hi").toggle(); 
});

看到结果：http://jsfiddle.net/5YKRb/1/

来源

2012-02-24 12:15:24 Neysor

<html> 
<head> 
</head> 
<body> 
<button onclick="$('#idOfDiv').toggle();">Show/Hide</button> 
<div id="idOfDiv"> 
    <img src="http://mybroadband.co.za/photos/data/500/apple-logo.jpg"/> 
    text text text text text text text text text....</div> 
</body> 
<script> 
$(document).ready(function(){ 
    $('#idOfDiv').hide(); 
}); 
</script> 
</html>

来源

2012-02-24 12:17:46 Alex

或者您可以使用“切换”功能。

$(document).ready(function(){ 
    $('#idOfDiv').hide(); 
    $('button').toggle(
     function(){ 
     $("#idOfDiv").show(); 
     }, 
     function() { 
     $("#idOfDiv").hide(); 
     } 
    ); 
});

来源

2012-02-24 12:17:49 Vishal

jquery hide /显示

回答

相关问题