属性过滤器
在昨天由老师带领我们统一回顾了一下属性过滤器,个人感觉像这种过滤器选择器之类的并不算太难,只要自己认真一点基本不会有什么错误,所以最主要的还是细心,不马虎。
属性过滤器jquery内容:
$(function () {
//$("a[id!='a1']").css("color","red")
$("textarea").css("overflow-x", "auto");
$("#name").attr("value", "张三");
alert($(":input").length);
alert($(":image").length);
});
属性过滤器boby内容:
<div style="height:1000px" >
<a id="a1" href="#">链接1</a>
<a id="a2" href="#">链接2</a>
<a id="a1" href="#">链接1</a>
</div>-->
然后在这个之后又重新回顾了表单选择器,又相对做了一部分联系:
<script type="text/javascript">
$(function () {
//$("a[id!='a1']").css("color","red")
$("textarea").css("overflow-x", "auto");
$("#name").attr("value", "张三");
alert($(":input").length);
alert($(":image").length);
$("#tj").click(function () {
var name = $(":text").val();
console.log(name);
//单选框
var sex = $(":radio:checked").val();
console.log(sex);
//复选框
var hot = "";
$(":checkbox:checked").each(function () {
hot += $(this).val() + "、";
})
console.log(hot);
//下拉列表
var drop = $("#Select1 :selected").val();
console.log(drop);
return false;
})
})
<table>
<tr>
<td>姓名:</td>
<td><input type="text" id="name" /></td>
</tr>
<tr>
<td>性别:</td>
<td>
<input type="radio" name="sex" id="sex1" value="男" checked="checked" />
<label for="sex1">男</label>
<input type="radio" name="sex" id="sex1" value="女" />
<label for="sex1">女</label>
</td>
</tr>
<tr>
<td>爱好:</td>
<td>
<input type="checkbox" id="aihao" value="足球"/>足球
<input type="checkbox" id="aihao" value="篮球" />篮球
<input type="checkbox" id="aihao" value="羽毛球"/>羽毛球
</td>
</tr>
<tr>
<td>籍贯:</td>
<td>
<select id="Select1">
<option value="--请选择--">--请选择--</option>
<option>郑州</option>
<option>洛阳</option>
<option>开封</option>
<option>濮阳</option>
<option>南阳</option>
<option>安阳</option>
<option>信阳</option>
</select>
</td>
</tr>
<tr>
<td>简介:</td>
<td>
<textarea name="" rows="10" cols="25">
</textarea>
</td>
</tr>
<tr>
<td></td>
<td colspan="2">
<input type="button" value="重置" id="cz"/>
<input type="button" value="提交" id="tj" />
</td>
</tr>
</table>
输入的数据输出效果如下: