jquery元素隐藏与显示示例

发布时间:2020-02-25编辑:脚本学堂
有关jquery元素的隐藏与显示方法,设置元素的hide与show属性,不了解的朋友参考下。

jquery元素隐藏与显示

代码:
 

复制代码 代码示例:
<html xmlns="http://www.w3.org/1999/xhtml"> 
<head runat="server"> 
<title>jquery元素隐藏与显示 - www.plcxue.com</title> 
<script type="text/jscript" src="jquery/jquery-1.10.2.js"></script> 
<script type="text/javascript"> 
$(document).ready(function () { 
$("#but1").click(function () { 
$("#tex1").hide(); 
}); 
}) 
$(document).ready(function () { 
$("#but2").click(function () { 
$("#tex1").show(); 
}); 
}) 
</script> 
</head> 
<body> 
<form id="form1" runat="server"> 
<div> 
<input type="button" value="客户端隐藏"  onclick="document.getElementById('tex1').style.display='none'" /> 
<input type="button" value="客户端显示"  onclick="document.getElementById('tex1').style.display='inline'" /> 
<input type="button" value="$客户端隐藏" id="but1" /> 
<input type="button" value="$客户端显示" id="but2" /> 
<input type="text" id="tex1" /> 
</div> 
</form> 
</body> 
</html>