用jQuery填写表单

Question

我试图使用jQuery填写一些默认值的表单.

表单包含在具有id的div中.事实上,每个元素都有一个id,我这样做只是为了能够使用$("#id")语法快速选择表单的每一部分.
这是表格:

<div id="panel" style="position: absolute; left: 190px; top: 300px; width: 400px; height: 300px; border: medium groove brown; background: none repeat scroll 0% 0% black; z-index: 100; color: white;"><form id="form_coord_0">  
X <input type="text" style="height: 25px; font-size: 10px;" size="2" name="X" id="coordX_0"/>  
Y <input type="text" style="height: 25px; font-size: 10px;" size="2" name="Y" id="coordY_0"/>  
<input type="button" id="edit_0" value="M"/>  
<input type="button" id="remove_0" value="-"/>  
<input type="button" id="add_0" value="+"/>  
<input type="button" id="go_0" value="go!"/>  
<br/>  
</div>  

我需要设置coordX_0一些值的文本字段,让我们说:123.

我以为我能做到

$("#coordX_0").text.value = 123;  

但它似乎没有用.任何提示？

Answer 1

您可以使用val()函数来设置输入值

$("#coordX_0").val(123);  

顺便说一下,你可以通过在实际的底层dom元素上设置value属性来使你的原始代码工作.您可以通过索引jQuery结果来访问dom元素:

$("#coordX_0")[0].value = 123;  

Answer 2

所有答案都完全一样,所以我想我会发布一些不同的东西:

var inputs_to_values = {
    'coordX_0' : 'some value',
    'coordY_0' : 'some other value',
    'edit_0'   : 'N',
    'remove_0' : '_',
    'add_0'    : '-',
    'go_0'     : 'stop?'
};
$('#form_coord_0').find('input').val(function (index, value) {
    return inputs_to_values[this.id];
});

你可以传递.val()一个函数,无论函数返回什么,每个元素都将是新值:

将值返回到set的函数.

这是当前的元素.

接收集合中元素的索引位置和旧值作为参数.

资料来源:http://api.jquery.com/val

上面的代码期望每个输入在inputs_to_values对象中都有一个属性,因此您可以将输入的ID转换为该输入的新值.

这是一个演示:http://jsfiddle.net/zYfpE/