jQuery如何设置输入文本字段的值（代码实例） _前端开发

这里有一个Input元素，任务是使用JQuery设置它的值。下面是讨论的一些例子。
要了解示例, 首先要了解几种方法。
jQuery val()方法：
此方法返回/设置所选元素的value属性。
如果使用此方法返回值, 它将返回FIRST选定元素的值。
如果使用此方法设置值, 它将为一组选定元素设置一个或多个value属性。
语法如下：
返回值属性：

$(selector).val()

设置值属性：

$(selector).val(value)

使用函数设置value属性：

$(selector).val(function(index, curValue))

参数：
【jQuery如何设置输入文本字段的值（代码实例）】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" valuehttps://www.lsbin.com/= "" /> < 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" valuehttps://www.lsbin.com/= "" /> < br > < br > < button id = "setText" > setText < / button > < script > $("#setText").click( function(event) { $('body input').val( "lsbin"); }); < / script > < / body > < / html >

输出如下：
在单击按钮之前：