通过使用JQuery单击链接填写表中的不同输入字段

时间:2012-02-07 09:48:27

标签: jquery html-table autofill

如何获取每行中点击的值(使用AddRowTable插件生成),即

<script type="text/javascript">
$("document").ready(function(){
$(".addRow-Max4").btnAddRow({maxRow:4, inputBoxAutoNumber:true});
$(".delRow").btnDelRow();
});
</script> 

在表格中生成最多4行并为每个输入框编号,因此我在表格中获得了textfield1,textfield2等等。

<table border="0" >
<tr>
    <th colspan="2">Input your data</th>
    <th><input type="button" value="Add Row" class="addRow-Max4"/></th>
</tr>
<tr><td>
    <a href="#" class="autofill">Apple</a> 
    <a href="#" class="autofill">Banana</a> 
    <a href="#" class="autofill">Mango</a>
    </td><td><input type="text" name="textfield" class="autofill" size="25"/></td>
    <td><img src="./images/cross.gif" class="delRow" border="0"></td>
</tr>
</table>

现在我可能会在第1行中决定使用Apple,在第2行中决定使用芒果等等,并希望填充此行的相应文本字段。

我有

$("a[class=autofill]").live("click", function(){
$("input[name=textfield1]").val($(this).text());
return false;
});

但我如何调整它以使其为每一行动态。我们说textfield1,textfield2,textfield3等等。就像现在一样,每次点击链接时我都会更改textfield1。但是,如果单击其中一个相应的(同一行)链接,我想更改它。

1 个答案:

答案 0 :(得分:1)

对此问题没有太多了解。但这是我尝试在其父TR中找到所有输入字段。

$("a[class=autofill]").live("click", function(){
    $(this).closest('tr').find("input").val($(this).text());
    return false;
});

这是我试过的:

http://jsfiddle.net/KU6Xw/