表單對象選擇器
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>ddd</title>
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<style type="text/css">
div,span{
width: 140px;
height: 140px;
margin: 20px;
background: #9999CC;
border: #000 1px solid;
float:left;
font-size: 17px;
font-family:Roman;
}
div.mini{
width: 30px;
height: 30px;
background: #CC66FF;
border: #000 1px solid;
font-size: 12px;
font-family:Roman;
}
div.visible{
display:none;
}
</style>
<!--引入jquery的js庫-->
<script type="text/javascript" src="js/jquery-1.3.1.js"></script>
</head>
<body>
<h1>XXXX</h1>
<h2>XXXXXXX</h2>
<h3>XXXXXXXXX</h3>
<input type="button" value="利用 jQuery 對象的 val() 方法改變表單內 type=text 可用 <input> 元素的值" id="b1"/>
<input type="button" value="利用 jQuery 對象的 val() 方法改變表單內 type=text 不可用 <input> 元素的值" id="b2"/>
<input type="button" value="利用 jQuery 對象的 length 屬性獲取多選框選中的個數" id="b3"/>
<input type="button" value="利用 jQuery 對象的 text() 方法獲取下拉框選中的內容" id="b4"/>
<br>
<input type="text" value="籃球1"/>
<input type="text" value="籃球2"/>
<input type="text" value="籃球3" disabled="true"/>
<input type="text" value="籃球4" disabled="true"/>
<br>
<input type="checkbox" value="愛好1"/>愛好1
<input type="checkbox" value="愛好2"/>愛好2
<input type="checkbox" value="愛好3"/>愛好3
<input type="checkbox" value="愛好4"/>愛好4
<br>
<select name="job" size=9 multiple="multiple">
<option value="選項1">選項1^^</option>
<option value="選項2">選項2^^</option>
<option value="選項3">選項3^^</option>
<option value="選項4">選項4^^</option>
<option value="選項5">選項5^^</option>
<option value="選項6">選項6^^</option>
</select>
<select id="hsp" name="edu">
<option value="博士">博士^^</option>
<option value="碩士">碩士^^</option>
<option value="本科">本科^^</option>
<option value="小學">小學^^</option>
</select>
</body>
<script language="JavaScript">
//*利用 jQuery 對象的 val() 方法改變表單內 type=text 可用 <input> 元素的值
$("#b1").click(function(){
$("input[type=text]").val("籃球")
})
//**利用 jQuery 對象的 length 屬性獲取多選框選中的個數
$("#b3").click(function(){
window.alert($("input[type=checkbox]:checked").length)
})
//****利用 jQuery 對象的 text() 方法獲取下拉框選中的內容
$("#b4").click(function(){
window.alert($("select option:selected").text())
})
</script>
</html>
相關文章
- 1. jQUery選擇器之表單對象屬性篩選選擇器
- 2. jQuery選擇器—表單選擇器
- 3. jQuery選擇器——表單選擇器
- 4. jQuery(2-8)表單對象過濾屬性選擇器
- 5. 尚硅谷：jQuery的表單對象屬性過濾選擇器
- 6. jQuery 對象、基本選擇器、篩選選擇器
- 7. 8.:input表單選擇器
- 8. jQuery 表單選擇器
- 9. 表單和CSS選擇器
- 10. 表格，表單和高級選擇器
- 更多相關文章...
- • jQuery Mobile 表單選擇菜單 - jQuery Mobile 教程
- • ionic 單選框 - ionic 教程
- • Docker容器實戰(七) - 容器眼光下的文件系統
- • Docker容器實戰(六) - 容器的隔離與限制
相關標籤/搜索
每日一句
-
每一个你不满意的现在，都有一个你没有努力的曾经。
最新文章
- 1. 在windows下的虛擬機中,安裝華爲電腦的deepin操作系統
- 2. 強烈推薦款下載不限速解析神器
- 3. 【區塊鏈技術】孫宇晨：區塊鏈技術帶來金融服務的信任變革
- 4. 搜索引起的鏈接分析-計算網頁的重要性
- 5. TiDB x 微衆銀行 | 耗時降低 58%，分佈式架構助力實現普惠金融
- 6. 《數字孿生體技術白皮書》重磅發佈（附完整版下載）
- 7. 雙十一「避坑」指南：區塊鏈電子合同爲電商交易保駕護航！
- 8. 區塊鏈產業，怎樣「鏈」住未來？
- 9. OpenglRipper使用教程
- 10. springcloud請求一次好用一次不好用zuul Name or service not known
歡迎關注本站公眾號,獲取更多信息
相關文章