JQuery 常用

zengshaotao

浏览: 808680 次
性别:
来自: 上海

最近访客更多访客>>

njdccy

AK1343794853

chehaoj

jstl1point0

博主相关

博客

微博

相册

留言

关于我

文章分类

社区版块

存档分类

博客分类：

JQuery

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<script type="text/javascript" src="JQuery/jquery-1.3.2.min.js"></script>
<title>Insert title here</title>
<style type="text/css">
#menu{width:300px;}
.has_children{background:#555;color:#fff;cursor:pointer;}
.highlight{color:#fff;background:green;}
div{padding:0;margin:10px 0;}
div a{background:#888;display:none;float:left;width:300px;}
</style>
</head>
<script type="text/javascript">
$(function(){

$(".has_children").click(function(){
  $(this).addClass("highlight")
  .children("a").show()
  .end().//重新定位到上次操作的元素，也就是当前元素
  siblings().removeClass("highlight").
  children("a").hide();
});

var $test = $("#test");
//这里演示jquery对象和dom对象的转换
var test = $test[0];
$test.click(function(){
  if(test.checked){
   alert("已选择，这里是dom方式的判断");
  }
});

var $jtest = $("#jtest");
$jtest.click(function(){
  if($jtest.is(":checked")){
   alert("已选择，这里是jquery方式的判断");
  }
});

//$("#ElementId")获取的永远是对象，即使网页上没有该元素，因此判断一个元素是否存在，应该
//进行如下的判断(当然也可以先转换为dom对象，然后再判断)
if($("#ElementId").length>0){
  //do something
}

//这里是数组的测试
var arr = new Array();
arr.push("add a element");

//在一个id为table的表格的tbady中，如果每行最后一列中的checkbox没有被禁用
//则把这行的背景设为红色
$("#table>tbody>tr:has(td:last:has(:checkbox:enabled))").css("background","red");
});
</script>
<body>
<h1>JQuery例子测试</h1>
<div id="menu">
<div class="has_children">
  <span>第1章 -认识JQuery</span>
  <a>1.1-javascript和其库</a>
  <a>1.2-javascript和其库</a>
  <a>1.3-javascript和其库</a>
</div>
<div class="has_children">
  <span>第2章 -JQuery选择器</span>
  <a>2.1-javascript和其库</a>
  <a>2.2-javascript和其库</a>
  <a>2.3-javascript和其库</a>
</div>
<div class="has_children">
  <span>第3章 -JQuery中的DOM操作</span>
  <a>3.1-javascript和其库</a>
  <a>3.2-javascript和其库</a>
  <a>3.3-javascript和其库</a>
</div>
</div>

<input type="checkbox" id="test"/>
<label for="test">我已经阅读了上面的条款（dom方式判断）</label>
<br>
<input type="checkbox" id="jtest"/>
<label for="jtest">我已经阅读了上面的条款（jquery方式判断）</label>

</body>
</html>

分享到：

javascript 高级 | java发送邮件

2012-12-14 16:25
浏览 828
评论(0)
分类:Web前端
查看更多

发表评论

您还没有登录,请您登录后再发表评论

最近访客更多访客>>

博主相关

文章分类

社区版块

存档分类

最新评论

JQuery 常用

评论

发表评论

相关推荐

最近访客 更多访客>>

博主相关

文章分类

社区版块

存档分类

最新评论

JQuery 常用

评论

发表评论

相关推荐

input 隐藏 方法传入字符串参数

JQuery 之empty and remove

easyui dialog隐藏与显示

cookie操作 JQuery

表单参数一并提交

JQuery解析XML

表格动态展示与下钻

JQuery tree的使用

兄弟frame之间控制页面

easy ui 树的常用功能

attr（），css()

$.browser.msie为空

jOrgChart 后端取数--递归构建map

jOrgChart 后端取数--手工构建map

jOrgChart横向的组织机构树--手工构造json数据

jOrgChart的调试模式

jOrgChart横向的组织机构数插件

easy ui data grid

JQuery easy ui 图标扩展

获取页面高度

最近访客更多访客>>

input 隐藏方法传入字符串参数