jQuery中val()方法用法實(shí)例
更新時(shí)間：2014年12月25日 09:29:38 投稿：shichen2014
這篇文章主要介紹了jQuery中val()方法用法,以實(shí)例形式分析了val()方法的兩種常見用法,具有一定的參考借鑒價(jià)值,需要的朋友可以參考下
本文實(shí)例講述了jQuery中val()方法用法。分享給大家供大家參考。具體分析如下：
此方法設(shè)置或獲取匹配元素的value屬性值。
只有具有value屬性的元素才能夠使用此方法。比如input元素可以使用此方法，而div元素就不可以。
使用方式：
用法一:
此方法不帶參數(shù)的時(shí)候是返回第一個(gè)匹配元素的value屬性值。例如:
復(fù)制代碼 代碼如下:
$("input").val()
以上代碼是獲取第一個(gè)input元素的value屬性值。
實(shí)例代碼:
復(fù)制代碼 代碼如下:
<!DOCTYPE html>
<html>
<head>
<meta charset=" utf-8">
<meta name="author" content="http://m.fzitv.net/" />
<title>val()函數(shù)-腳本之家</title>
<script type="text/javascript" src="mytest/jQuery/jquery-1.8.3.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$("button").click(function(){
alert($("input").val());
})
})
</script>
</head>
<body>
<div>
<ul>
<li>
<input type="text" value="請(qǐng)輸入用戶名" />
</li>
</ul>
</div>
<button>點(diǎn)擊查看效果</button>
</body>
</html>
用法二:
此方法帶有參數(shù)的時(shí)候是設(shè)置所有匹配元素的屬性值。例如：
復(fù)制代碼 代碼如下:
$("input").val("這是測(cè)試腳本")
以上代碼將所有input元素的value屬性值設(shè)置為"這是測(cè)試腳本"。
實(shí)例:
復(fù)制代碼 代碼如下:
<!DOCTYPE html>
<html>
<head>
<meta charset=" utf-8">
<meta name="author" content="http://m.fzitv.net/" />
<title>val()函數(shù)-腳本之家</title>
<script type="text/javascript" src="mytest/jQuery/jquery-1.8.3.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$("button").click(function(){
$("input").val("這是測(cè)試腳本");
})
})
</script>
</head>
<body>
<div>
<ul>
<li>
<input type="text" value="請(qǐng)輸入用戶名" />
</li>
</ul>
</div>
<button>點(diǎn)擊查看效果</button>
</body>
</html>
希望本文所述對(duì)大家的jQuery程序設(shè)計(jì)有所幫助。
您可能感興趣的文章:
- jquery 根據(jù)name名獲取元素的value值
- jQuery對(duì)val和atrr("value")賦值的區(qū)別介紹
- JQuery中的html()、text()、val()區(qū)別示例介紹
- 淺析JQuery中的html(),text(),val()區(qū)別
- jquery控制select的text/value值為選中狀態(tài)
- jquery獲取當(dāng)前點(diǎn)擊對(duì)象的value方法
- jQuery中的val()示例應(yīng)用
- jquery text(),val(),html()方法區(qū)別總結(jié)
- Jquery使用val方法讀寫value值
相關(guān)文章
JQuery中DOM節(jié)點(diǎn)的操作與訪問(wèn)方法實(shí)例分析
這篇文章主要介紹了JQuery中DOM節(jié)點(diǎn)的操作與訪問(wèn)方法,結(jié)合實(shí)例形式分析了jquery操作dom節(jié)點(diǎn)與訪問(wèn)dom節(jié)點(diǎn)相關(guān)實(shí)現(xiàn)技巧及操作注意事項(xiàng),需要的朋友可以參考下2019-12-12
Jquery循環(huán)截取字符串的方法(多出的字符串處理成"...")
下面小編就為大家?guī)?lái)一篇Jquery循環(huán)截取字符串的方法(多出的字符串處理成"...")。小編覺得挺不錯(cuò)的，現(xiàn)在就分享給大家，也給大家做個(gè)參考。一起跟隨小編過(guò)來(lái)看看吧2016-11-11
jQuery Migrate是應(yīng)用遷移輔助插件，是用于高級(jí)版本兼容低級(jí)版本輔助插件。這篇文章主要介紹了jQuery Migrate 插件用法 ,需要的朋友可以參考下2019-05-05
jquery圖片不完全按比例自動(dòng)縮小的簡(jiǎn)單代碼
開發(fā)前期用自動(dòng)生產(chǎn) 固定大小的圖片 進(jìn)行 顯示，發(fā)現(xiàn)不能滿足，在前期的時(shí)候把保存了原圖，現(xiàn)在只能顯示原圖，原圖由于上傳時(shí)候沒(méi)有做任何限制所有要使用 圖片不完全按比例縮小，下面是代碼2013-07-07
這篇文章主要介紹了jQuery的one()方法用法,實(shí)例分析了one()方法的功能、定義及為匹配元素的特定事件綁定一個(gè)一次性的事件處理方法使用技巧,需要的朋友可以參考下2015-01-01
這篇文章主要為大家詳細(xì)介紹了如何快速掌握jQuery插件WebUploader文件上傳和圖片上傳操作,具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2016-11-11
這篇文章主要介紹了Jquery插件編寫簡(jiǎn)明教程,jquery插件開發(fā)實(shí)例,需要的朋友可以參考下2014-03-03
jQuery實(shí)現(xiàn)checkbox全選功能完整實(shí)例
這篇文章主要介紹了jQuery實(shí)現(xiàn)checkbox全選功能,結(jié)合完整實(shí)例形式分析了jQuery事件響應(yīng)及頁(yè)面元素屬性動(dòng)態(tài)操作相關(guān)實(shí)現(xiàn)技巧,需要的朋友可以參考下2018-07-07
這篇文章主要介紹了jQuery從零開始做一個(gè)分頁(yè)組件功能,結(jié)合實(shí)例形式分析了jQuery分頁(yè)組件的具體步驟、功能實(shí)現(xiàn)技巧與操作注意事項(xiàng),需要的朋友可以參考下2020-05-05
表格增行刪行一般情況下都是通過(guò)修改html結(jié)構(gòu)實(shí)現(xiàn)的，接下來(lái)為大家介紹下如何使用jquery實(shí)現(xiàn)表格增行刪行，感興趣的各位可不要錯(cuò)過(guò)了哈2013-03-03