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

新手上路 jquery 选择器篇(三) 代码笔记

2017-07-25 20:46 316 查看
<head>
<meta charset="UTF-8">
<title></title>
<script type="text/javascript" src="js/jquery-3.2.1.js"></script>

</head>
<body>
<!--
选择器                   名称                                 举例
表单选择器           :input        查找所有的input元素:$(":input")
注意:会匹配所有的input、textarea、select和button元素。
文本框选择器        :text          查找所有文本框:$(":text")
密码框选择器        :password 查找所有密码框:$(":password")
单选按钮选择器     :radio       查找所有单选按钮:$(":radio")
复选框选择器        :checkbox 查找所有复选框:$(":checkbox")
提交按钮选择器     :submit     查找所有提交按钮:$(":submit")
图像域选择器        :image      查找所有图像域:$(":image")
重置按钮选择器    :reset         查找所有重置按钮:$(":reset")
按钮选择器           :button      查找所有按钮:$(":button")
文件域选择器        :file           查找所有文件域:$(":file")

-->
<form id="myform" method="post" name="myform">
姓名:<input type="text" name="uname" id="uname" value="" />
<br />
密码:<input type="password" name="upwd" id="upwd" value="147258" />
<br />
职业:
<input type="radio" name="ulive" id="" value="0" checked="checked"/>修仙
<br />
<input type="radio" name="ulive" id="" value="1"/>修魔
<br />
爱好:
<input type="checkbox" name="fav" id="" value="足球" />足球
<br />
<input type="checkbox" name="fav" id="" value="running" />running
<br />
<input type="checkbox" name="fav" id="" value="蓝球" />蓝球
<br />
<input type="checkbox" name="fav" id="" value="各种撸" />各种撸
<br />
<input type="checkbox" name="fav" id="" value="book" />book
<br />
君归处:
<select name="myselect" id="myselect">
<option value="0">浙江</option>
<option value="1">天津</option>
<option value="2">天南</option>
</select><br />

<input type="hidden" value="15" name="hid" disabled="disabled"/>

<button>提交</button>

</form>
</body>

<script type="text/javascript">
//表单选择器 :input  --->会匹配所有的input、textarea、
//select和button元素。
var inputs = $(':input');
inputs.each(function(){
console.log(this);
});

console.log(">=--------------密码框选择器------------->")
var pass = $(':password');
pass.each(function(){
console.log(this);
});

console.log(">=--------------文本框选择器------------->");
//文本框选择器 :text
var texts = $(':text');
texts.each(function(){
console.log(this);
});

console.log(">=--------------单选按钮选择器  ------------->");
var radio1 = $(':radio');
radio1.each(function(){

console.log(this);
});

console.log(">=--------------复选框选择器 (其他的类似,不在追叙)------------->");
var checkbox1 = $(':checkbox');
checkbox1.each(function(){

console.log(this);
});

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