这里有一个Input元素,任务是使用JQuery设置它的值。下面是讨论的一些例子。
要了解示例, 首先要了解几种方法。
jQuery val()方法:
此方法返回/设置所选元素的value属性。
如果使用此方法返回值, 它将返回FIRST选定元素的值。
如果使用此方法设置值, 它将为一组选定元素设置一个或多个value属性。
语法如下:
返回值属性:
$(selector).val()
设置值属性:
$(selector).val(value)
使用函数设置value属性:
$(selector).val(function(index, curValue))
参数:
value: 此参数是必需的。它指定值属性的值。
function(index, currentValue):此参数是可选的。它指定了返回要设置的值的函数。
- index:它返回集合中元素的索引位置。
- curValue:它返回所选元素的当前值属性。
范例1:在此示例中, 输入元素的值设置为val()方法通过从其ID中选择输入元素。
<!DOCTYPE HTML>
< html >
< head >
< title >
JQuery | Set value of input text.
</ title >
< script src =
"https://ajax.googleapis.com/ajax/libs/jquery/3.4.0/jquery.min.js" >
</ script >
</ head >
< body style = "text-align: center;" >
< h1 style = "color: green;" >
lsbin
</ h1 > Input Box:
< input id = "input"
type = "text"
class = "Disable"
value = "" />
< br >
< br >
< button id = "setText" >
setText
</ button >
< script >
$("#setText").click(function(event) {
$('#input').val("lsbin");
});
</ script >
</ body >
</ html >
输出如下:
在单击按钮之前:
单击按钮后:
范例2:在此示例中, 输入元素的值设置为val()方法通过从其父元素<body>中选择输入元素, 然后选择<input>元素。
<!DOCTYPE HTML>
< html >
< head >
< title >
JQuery
| Set value of input text.
</ title >
< script src =
"https://ajax.googleapis.com/ajax/libs/jquery/3.4.0/jquery.min.js" >
</ script >
</ head >
< body style = "text-align: center;" >
< h1 style = "color: green;" >
lsbin
</ h1 > Input Box:
< input id = "input"
type = "text"
class = "Disable"
value = "" />
< br >
< br >
< button id = "setText" >
setText
</ button >
< script >
$("#setText").click(
function(event) {
$('body input').val(
"lsbin");
});
</ script >
</ body >
</ html >
输出如下:
在单击按钮之前:
单击按钮后: