JQuery對象將無法使用DOM對象的任何方法。同樣,DOM對象也不能使用JQuery裏的方法。
區分JQuery對象和DOM對象?
如果獲取的是一個JQuery對象,那麼我們在變量前面加上$,如:var $variable = $("#user");//JQuery對象
如果獲取的是DOM對象,如:
var variable = document.getElementById("user");//DOM對象
需求分析:
實現表單驗證滿足條件後提交後臺功能
以下是具體代碼演示:
<%@ page language="java" import="java.util.*" pageEncoding="gbk"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<base href="<%=basePath%>">
<title>My JSP 'index2.jsp' starting page</title>
<meta http-equiv="pragma" content="no-cache">
<meta http-equiv="cache-control" content="no-cache">
<meta http-equiv="expires" content="0">
<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
<meta http-equiv="description" content="This is my page">
<!--
<link rel="stylesheet" type="text/css" href="styles.css">
-->
<!-- DOM對象實現表單驗證滿足條件後提交後臺 -->
<!-- <script type="text/javascript"> -->
<!-- function agree(){ -->
<!-- var chk = document.getElementById("chk"); -->
<!-- if(chk.checked){ -->
<!-- alert("謝謝註冊!"); -->
<!-- } -->
<!-- } -->
<!-- </script> -->
<!-- JQuery對象實現表單驗證滿足條件後提交後臺 -->
<script src="<%=path %>/js/jquery-1.4.1.js"></script>
<script type="text/javascript">
// $(function (){
// alert('---------');
// });
$(function(){
var $chk = $("#chk"); //獲取JQuery對象
$chk.click(function(){ //綁定點擊事件
if($chk.is(":checked")){ //判斷JQuery對象是否選中
alert("謝謝註冊!");
}
});
});
</script>
</head>
<body>
<form οnsubmit="return agree()">
<input type="checkbox" id="chk"/><label for="chk">我已經閱讀並接收上面的許可</label>
<br/>
<input type="submit" value="提交"/>
</form>
</body>
</html>