jquery做隐藏和显示的三种方法

2009-12-17 11:38:31 by 【6yang】, 100 visits, 收藏 | 返回

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
</head><style type="text/css">

</style>
<script language="javascript" src="js/jquery-1.3.2.min.js"></script>
<script language="javascript">
$(function(){

/*第一种方法
$("input:first").click(function(){
  $("p").hide(); //隐藏
});
$("input:last").click(function(){
  $("p").show(); //显示
});*/

/*第二种方法
$("input").prev().click(function(){
  $("p").hide(); //隐藏
});
$("input").next().click(function(){
  $("p").show(); //显示
});*/
//第三种方法
$("input:first").click(function(){
  $("p").css("display","block");
});
$("input:last").click(function(){
  $("p").css("display","none");
});
});
</script>
<body>
<input type="button" value="Hide"> <input type="button" value="Show">
<p >点击按钮，看看效果
    <span>一段其它的文字</span></p>
</body>
</html>

分享到：

我要评论本文来自:http://www.6yang.net/articles_view.php?id=664&cid=6

share

技术标签 TAGS

专业技术精选

首页 > 技术 > Ajax学习记录

jquery做隐藏和显示的三种方法

图片原图