jQuery表單域屬性過濾器用法分析
本文實例講述了jQuery表單域屬性過濾器用法。分享給大家供大家參考。具體分析如下:
表單內包含各種各樣的表單域,使用表單域屬性選擇器可以很好的獲取已被選中的單選按鈕,復選框以及列表項,也可以根據是否可用從文檔中查找表單域。
1. :checked選擇器
用于選擇所有被選中的表單域。格式:
2. :enabled選擇器
用于選擇所有可用的表單域,格式:
3. :disabled選擇器
用于選擇所有被禁用的表單域,格式:
4. :selected選擇器
用于從列表框選擇所有選中的option元素,格式:
5. :hidden選擇器
用于選擇所有的不可見元素
6. :visible選擇器
用于選擇所有的可見元素
簡單示例:
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>表單域屬性過濾選擇器應用示例</title>
<script type="text/javascript" src="jquery-1.7.min.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$("input:checked").css("border", "1px solid red");
$("input:disabled").css("background", "#FCF");
$("input:enabled").val("可用文本框");
});
</script>
</head>
<body>
<h3 align="center">表單域屬性過濾選擇器應用示例</h3>
<table width="602" height="81" border="1">
<tr>
<td width="118">復選框:</td>
<td width="443"><input type="checkbox" checked="checked" />被選中的復選框
<input type="checkbox" checked="checked" />被選中的復選框
<input type="checkbox" />沒有被選中的復選框
</td>
</tr>
<tr>
<td>可用文本框:</td>
<td><input type="text"/></td>
</tr>
<tr>
<td>不可用文本框:</td>
<td><input type="text" disabled="disabled" /></td>
</tr>
<tr>
<td>下拉列表</td>
<td>
<select name="test" >
<option>浙江</option>
<option>湖南</option>
<option selected="selected">北京</option>
<option selected="selected">天津</option>
<option>廣州</option>
<option>湖北</option>
</select>
</td>
</tr>
</table>
</body>
</html>
效果圖:
希望本文所述對大家的jQuery程序設計有所幫助。
- jQuery中可見性過濾器簡單用法示例
- jQuery中過濾器的基本用法示例
- JQuery的常用選擇器、過濾器、方法全面介紹
- jQuery使用contains過濾器實現(xiàn)精確匹配方法詳解
- jQuery可見性過濾器:hidden和:visibility用法實例
- JQuery選擇器、過濾器大整理
- Jquery 過濾器(first,last,not,even,odd)的使用
- 從jquery的過濾器.filter()方法想到的
- jQuery contains過濾器實現(xiàn)精確匹配使用方法
- jQuery ajax 路由和過濾器使用說明
- jquery中通過過濾器獲取表單元素的實現(xiàn)代碼
- JQuery 選擇器、過濾器介紹
- jQuery中內容過濾器簡單用法示例
相關文章
jQuery插件FusionWidgets實現(xiàn)的AngularGauge圖效果示例【附demo源碼】
這篇文章主要介紹了jQuery插件FusionWidgets實現(xiàn)的AngularGauge圖效果,結合具體實例形式分析了jQuery使用FusionWidgets插件載入xml數(shù)據實現(xiàn)AngularGauge圖的相關操作技巧,并附帶demo源碼供讀者下載參考,需要的朋友可以參考下2017-03-03jQuery幫助之篩選查找 children([expr])
取得一個包含匹配的元素集合中每一個元素的所有子元素的元素集合。2011-01-01Jquery實現(xiàn)列表(隔行換色,全選,鼠標滑過當前行)效果實例
Jquery實現(xiàn)列表(隔行換色,全選,鼠標滑過當前行)效果實例,需要的朋友可以參考一下2013-06-06基于jQuery和hwSlider實現(xiàn)內容左右滑動切換效果附源碼下載(一)
本文結合實例給大家介紹如何實現(xiàn)內容滑動切換的效果,包括左右箭頭切換,無限無縫滾動,圓點按鈕切換,動畫效果,自動切換效果,效果非常不錯,感興趣的朋友前來參考實現(xiàn)代碼2016-06-06