您的位置:首页 > Web前端 > JQuery

02_Jquery_04_属性选择器

2016-08-12 15:04 507 查看
【简述】

【index.jsp】

<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>Jquery Test</title>
<!-- 导入Jquery文件 -->
<script type="text/javascript" src="${pageContext.request.contextPath}/jquery-1.5.1.js"></script>
<script type="text/javascript">
//这里的内容会在文档加载完毕时执行
$(function(){
 alert($("[name]").length);
});
</script>
</head>

<body>
This is my JSP page. <br>
name:    <input type="text" name="name"/><br/>
age:     <input type="text" name="age"/><br/>
password:<input type="text" name="psw"/><br/>
<input type="submit" value="登录"/>
</body>
</html>


【运行结果1】alert($("[name]").length);



【运行结果2】如果修改为:alert($("[name=age]").length);





【运行结果3】如果修改为:$("[name]").val("Higgin"); 会在对应的文本框中显示val("Higgin")中的内容



【通过属性选择器获取下拉列表中的内容】

<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>Jquery Test</title>
<!-- 导入Jquery文件 -->
<script type="text/javascript" src="${pageContext.request.contextPath}/jquery-1.5.1.js"></script>
<script type="text/javascript">
//这里的内容会在文档加载完毕时执行
$(function(){
 alert($(":selected").text());   //获得selected="selected"的属性的值
});
</script>
</head>

<body>
This is my JSP page. <br>
学历:
<select name="education">
<option value="1">大学</option>
<option value="2"selected="selected">中学</option>
<option value="3" >小学</option>
</select>
</body>
</html>


【运行结果】

内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: