大家都知道,当我们在一个新的网站或者应用上注册账号时,必须先要同意它们的规章制度,才可以进行下一步操作,下面我们就分别用DOM对象和jQuery对象来简单实现以下。
效果描述:当鼠标点击文字前面的复选框时,会有一个alert警告框弹出,当点击警告框的缺点按钮之后,复选框会呈现选中的状态。
图一:点击复选框时
图二:点击确定按钮之后
具体代码如下:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>同意并接受注册协议</title>
<script src="../libs/jquery.js"></script>
</head>
<body>
<input type="checkbox" id="cr">
<label>我已经阅读了上面制度</label>
<script>
//用DOM方式来判断复选框是否被选中
/*$(document).ready(function () { //等待dom元素加载完毕
var $cr = $("#cr"); //jquery对象
var cr = $cr[0]; //dom对象,或者$cr.get(0)
$cr.click(function () {
if(cr.checked){
alert("感谢支持,可以继续操作了");
}
})
})*/
//使用jQuery中的方法来判断选项是否被选中
$(document).ready(function () { //等待dom元素加载完毕
var $cr = $("#cr");
$cr.click(function () {
if($cr.is(":checked")){ //jQuery方式判断
alert("感谢支持,现在可以继续操作啦");
}
})
})
</script>
</body>
</html>