jQuery val() 方法用于设置或获取被选form表单中元素的value值。我们一般用于表单的input元素中。

语法

//用于获取值
$(selector).val()
//用于设置值
$(selector).val(value)
//用于设置值
$(selector).val(function(index,currentvalue))

方法参数

参数说明
value它用于指定属性的值。
function (index, currentvalue)它是一个可选参数。用于指定返回要设置的值的函数。

例子

val() 方法主要用于获取表单元素或者设置表单元素的值。

对于form表单中的select元素，当有value值时，val()方法针对的是value值，当没有value值的时候这是文本值。

<!DOCTYPE html>  
<html lang="zh-CN">  
<head>  
  <meta charset="utf-8">  
  <title>val demo</title>  
  <style>  
  p {  
    color: red;  
    margin: 4px;  
  }  
  b {  
    color: blue;  
  }  
  </style>  
  <script src="https://code.jquery.com/jquery-1.10.2.js"></script>  
</head>  
<body>
<p></p>
<select id="single">
  <option>选项1</option>
  <option>选项2</option>
 <option>选项3</option>
</select>
<script>
function displayVals() {
  var singleValues = $( "#single" ).val();
  $("p").html("<b>Value值:</b>"+singleValues);
}
$( "select" ).change( displayVals );    
displayVals();
</script>
</body>  
</html>

jQuery val() 方法

加上value值效果

 <!DOCTYPE html>  
<html lang="zh-CN">  
<head>  
  <meta charset="utf-8">  
  <title>val demo</title>  
  <style>  
  p {  
    color: red;  
    margin: 4px;  
  }  
  b {  
    color: blue;  
  }  
  </style>  
  <script src="https://code.jquery.com/jquery-1.10.2.js"></script>  
</head>  
<body>
<p></p>
<select id="single">
  <option value="1">选项1</option>
  <option value="2">选项2</option>
 <option value="3">选项3</option>
</select>
<script>
function displayVals() {
  var singleValues = $( "#single" ).val();
  $("p").html("<b>Value值:</b>"+singleValues);
}
$( "select" ).change( displayVals );    
displayVals();
</script>
</body>  
</html>

jQuery val() 方法