生活随笔
收集整理的這篇文章主要介紹了
使用jQuery操作input的value值
小編覺得挺不錯的,現(xiàn)在分享給大家,幫大家做個參考.
表單控件是jQuery的重中之重,因為一旦牽扯到數(shù)據(jù)交互,就離不開form表單的使用,比如用戶的登錄注冊功能等。
在進行操作input的value值的時候,主要使用jQuery的val()方法。
點擊查看val()的使用方法
看如下代碼:
<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><title>Document</title><script type="text/javascript" src="jquery.js"></script><script type="text/javascript">$(function(){//一、獲取值//1.獲取單選框被選中的value值console.log($("input[type=radio]:checked").val()); // 2.復選框被選中的value,獲取的是第一個被選中的值, 如果沒有值,將顯示onconsole.log($("input[type=checkbox]:checked").val());//3.下拉列表被選中的值var obj = $("#timespan option:selected")//獲取被選中的值console.log(obj.val());// 獲取文本console.log(obj.text())// 二、設置值//1.設置單選按鈕和多選按鈕被選中項$("input[type=radio]").val(["1"]);$("input[type=checkbox]").val(["sleep", "play"]);//2.設置下拉列表框的選中值,必須使用select//因為option只能設置單個值,當給select標簽設置multiple, 那么我們設置多個值,就沒有辦法了。//但是使用select設置單個值和多個值都可以。$("selct").val(["2", "3"]);//3. 設置文本框的value值$("input[type=text]").val("this is a test."); })</script>
</head>
<body><form action="javascript:void(0)"><input type="radio" name="sex" value="1" />男<!-- 設置checked屬性表示選中當前選項 --><input type="radio" name="sex" value="0" checked=""/>女<input type="checkbox" name="eat" value="eat" checked=""/>吃飯<input type="checkbox" name="sleep" value="sleep"/>睡覺<input type="checkbox" name="play" value="play" checked="" />打豆豆<!-- 下拉列表 option標簽內設置selected屬性 表示選中當前 --><select name="timespan" id="timespan" class="Wdate"><option value="1">8:00-8:30</option><option value="2" selected="">8:30-9:00</option><option value="3">9:00-9:30</option></select><input type="text" name="" id="" value="請輸入"></form>
</body>
</html>
轉載于:https://www.cnblogs.com/yang-wei/p/9534521.html
超強干貨來襲 云風專訪:近40年碼齡,通宵達旦的技術人生
總結
以上是生活随笔為你收集整理的使用jQuery操作input的value值的全部內容,希望文章能夠幫你解決所遇到的問題。
如果覺得生活随笔網(wǎng)站內容還不錯,歡迎將生活随笔推薦給好友。