jQuery操作DOM之獲取表單控件的值
更新時間：2015年01月23日 10:49:47 投稿：shichen2014
這篇文章主要介紹了jQuery操作DOM之獲取表單控件的值,實例分析了jQuery獲取表單控件值的方法,需要的朋友可以參考下
本文實例講述了jQuery操作DOM之獲取表單控件的值。分享給大家供大家參考。具體分析如下：
HTML屬性與DOM屬性差別最大的地方，恐怕就要數(shù)表單控件的值了。比如，文本輸人框的 value屬性在DOM中的屬性叫defaultValue，DOM中就沒有value屬性。而選項列表（select) 元素呢，其選項的值在DOM中通常是通過selectedIndex屬性，或者通過其選項元素的 selected屬性來取得。
由于存在這些差異，在取得和設(shè)置表單控件的值時，最好不要使用.attr()方法。而對于選項列表呢，最好連.prop()方法也不要使用。那使用什么呢，建議使用jQuery提供的.val()方法：
復(fù)制代碼 代碼如下:
//取得文本輸入框的當(dāng)前值
var inputValue = $('#my-input').val();
//取得選項列表的當(dāng)前值
var selectValue = $('#my-select').val();
八設(shè)置單選列表的值
$('#my-single-select').val('value3');
/^設(shè)置多選列表的值
$('#my-multi-select').val(['value1', 'value2']);
var inputValue = $('#my-input').val();
//取得選項列表的當(dāng)前值
var selectValue = $('#my-select').val();
八設(shè)置單選列表的值
$('#my-single-select').val('value3');
/^設(shè)置多選列表的值
$('#my-multi-select').val(['value1', 'value2']);
與.attr()和.prop()—樣，.val()方法也可以接受一個函數(shù)作為其setter參數(shù)。有了這個 多用途的.val()方法，使用jQuery做Web開發(fā)你又會倍感高效。
希望本文所述對大家的jQuery程序設(shè)計有所幫助。
相關(guān)文章
詳細介紹jQuery.outerWidth() 函數(shù)具體用法
這篇文章通過jQuery示例代碼演示outerWidth()函數(shù)的具體用法，介紹的非常詳細，有需要的朋友可以借鑒2015-07-07
jquery.form.js框架實現(xiàn)文件上傳功能案例解析（springmvc）
這篇文章主要為大家詳細介紹了jquery.form.js/springmvc文件上傳功能的實現(xiàn)步驟，使用的技術(shù)有jquery.form.js框架，以及springmvc框架，具有實用價值，感興趣的小伙伴們可以參考一下2016-05-05
jQuery的Ajax的自動完成功能 允許您輕松地創(chuàng)建自動完成/自動提示框的文本輸入字段;如果沒有特定查詢的結(jié)果，它停止發(fā)送請求到服務(wù)器的其他查詢感興趣的朋友可以參考下啊2013-02-02
GitHub上人們分享的遮罩層插件也是玲瑯滿目,不過自己動手做一個的話肯定更復(fù)合自己的需求,這里就帶大家來看使用jQuery制作Web頁面遮罩層插件的實例教程,需要的朋友可以參考下2016-05-05
下面小編就為大家分享一篇jQuery實現(xiàn)標簽子元素的添加和賦值方法，具有很好的參考價值，希望對大家有所幫助。一起跟隨小編過來看看吧2018-02-02
這篇文章分別介紹了Jquery框架easyui判斷輸入密碼兩次是否相等，以及使用jQuery.validate驗證表單中兩次密碼是否一致的問題，需要的朋友可以參考下2015-12-12
jQuery遍歷之next()、nextAll()方法使用實例
這篇文章主要介紹了jQuery遍歷之next()、nextAll()方法使用實例,本文先是給出了實例代碼,然后對代碼的作用分析和說明,需要的朋友可以參考下2014-11-11
jQuery1.9.1源碼分析系列（十六）ajax之a(chǎn)jax框架
這篇文章主要介紹了jQuery1.9.1源碼分析系列（十六）ajax之a(chǎn)jax框架 的相關(guān)資料,需要的朋友可以參考下2015-12-12
jquery form input 選擇，獲取 id為 instanceInfo form 下的 隱藏的input,需要的朋友可以參考下2014-04-04
如果在iframe中使用則彈不出對話框，而有時候我們還必須得使用iframe而不能用jQuery的load方式，下面有個不錯的處理方法，希望對大家有所幫助2014-01-01