jQuery?表單事件與遍歷詳情
更新時間：2022年08月31日 08:24:28 作者：RiemannHypothesis???????
這篇文章主要介紹了jQuery?表單事件與遍歷詳情，文章圍繞主題展開詳細的內(nèi)容介紹，具有一定的參考價值，需要的小伙伴可以參考一下
表單事件
.blur()
為 "blur" 事件綁定一個處理函數(shù)，或者觸發(fā)元素上的 "blur" 事件（注：此事件不支持冒泡）。
$('#other').click(function() {
$('#target').blur();
});.focus()
為 JavaScript 的 "focus" 事件綁定一個處理函數(shù)，或者觸發(fā)元素上的 "focus" 事件。
$('#target').focus(function() {
alert('Handler for .focus() called.');
});.change()
為JavaScript 的 "change" 事件綁定一個處理函數(shù)，或者觸發(fā)元素上的 "change" 事件。
$('.target').change(function() {
alert('Handler for .change() called.');
});.submit()
當用戶試圖提交表單時，就會在這個表單元素上觸發(fā)submit事件。它只能綁定在<form>元素上。
$('#target').submit(function() {
alert('Handler for .submit() called.');
});遍歷
.map()
通過一個函數(shù)匹配當前集合中的每個元素,產(chǎn)生一個包含新的jQuery對象。
由于返回值是一個jQuery包裹的數(shù)組，所以通常會使用get()方法將其轉(zhuǎn)換成普通的數(shù)組。
<!DOCTYPE html>
<html lang="en" dir="ltr">
<head>
<meta charset="utf-8">
<title></title>
<script src="./jquery-3.6.0.min.js" charset="utf-8"></script>
</head>
<body>
<form method="post" action="">
<fieldset>
<div>
<label for="two">2</label>
<input type="checkbox" value="2" id="two" name="number[]">
</div>
<div>
<label for="four">4</label>
<input type="checkbox" value="4" id="four" name="number[]">
</div>
<div>
<label for="six">6</label>
<input type="checkbox" value="6" id="six" name="number[]">
</div>
<div>
<label for="eight">8</label>
<input type="checkbox" value="8" id="eight" name="number[]">
</div>
</fieldset>
</form>
<script type="text/javascript">
$('input').map(function(index) {
console.log(this.id);
})
</script>
</body>
</html>map()方法會返回一個新的數(shù)組。
.each()
遍歷一個jQuery對象，為每個匹配元素執(zhí)行一個函數(shù)。
<ul>
<li>foo</li>
<li>bar</li>
</ul>$( "li" ).each(function( index ) {
console.log( index + ":" + $(this).text());
});each()返回的是原來的數(shù)組，并不會新創(chuàng)建一個數(shù)組。
.get()
通過jQuery對象獲取一個對應(yīng)的DOM元素。
<ul> <li id="foo">foo</li> <li id="bar">bar</li> </ul>
console.log( $( "li" ).get( 0 ) );
到此這篇關(guān)于jQuery 表單事件與遍歷詳情的文章就介紹到這了,更多相關(guān)jQuery 表單事件內(nèi)容請搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家！
相關(guān)文章
這篇文章主要介紹了使用jQuery實現(xiàn)頁面定時彈出廣告效果,需要的朋友可以參考下2017-08-08
這篇文章主要介紹了如何基于jQuery實現(xiàn)五角星評分,文中通過示例代碼介紹的非常詳細，對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價值,需要的朋友可以參考下2020-09-09
json+jQuery實現(xiàn)的無限級樹形菜單效果代碼
這篇文章主要介紹了json+jQuery實現(xiàn)的無限級樹形菜單效果代碼,涉及jquery針對json數(shù)據(jù)的遍歷、讀取及動態(tài)操作技巧,具有一定參考借鑒價值,需要的朋友可以參考下2015-08-08
DIV的width寬度如何獲取呢？接下來介紹使用jquery獲取DIV的width寬度，感興趣的朋友可以了解下的2013-01-01
使用jQuery.wechat構(gòu)建微信WEB應(yīng)用
本期要講的就是我痛苦中掙扎徘徊后寫的jQuery.wechat，一個提供了統(tǒng)一API的、基于jQuery.promise的jQuery.plugin。希望能多少幫助到大家。2014-10-10
這篇文章主要介紹了 jQuery Plupload上傳插件的使用詳解,需要的朋友可以參考下2017-04-04
這篇文章主要介紹了jQuery實現(xiàn)的分頁功能,結(jié)合實例形式較為詳細的分析了jQuery實現(xiàn)分頁功能的具體步驟及相關(guān)操作技巧,包括前臺樣式、布局及jQuery分頁插件的調(diào)用方法,需要的朋友可以參考下2017-01-01
做web開發(fā)的朋友都應(yīng)該掌握前端優(yōu)化這個技巧，其中一個就是滾動延時加載。這個技巧應(yīng)用在了很多地方，比如新浪微博網(wǎng)頁版。以下就為大家詳細介紹，需要的朋友可以參考下2013-07-07
下面小編就為大家?guī)硪黄贘query Ajax type的4種類型(詳解)。小編覺得挺不錯的，現(xiàn)在就分享給大家，也給大家做個參考。一起跟隨小編過來看看吧2017-08-08
這篇文章主要介紹了jQuery中prev()方法用法,實例分析了prev()方法的功能、定義及取得匹配元素集合中每個元素緊鄰的前一個同輩元素使用技巧,需要的朋友可以參考下2015-01-01