0

这是我的问题......我只需单击一下即可填充多个文本字段。需要点击的链接放在一个用php生成的td中，数据来自一个MySQL db（血腥的JS初学者！）。

下面的代码只是我的问题的一个简短示例。

提前致谢

<script type='text/javascript'>
$(function(){
    $('.click').live('click', function() {
        $("#brand").val($(this).html());
        $("#color").val('I need the color here');
        $("#size").val('and here the size');
    });
});
</script>

<label for="brand">Brand:</label><input autocomplete="off" id="brand" type="text" name="brand" />
<label for="color">Color:</label><input autocomplete="off" id="color" type="text" name="color" />
<label for="size">Size:</label>
<select id="size" name="size">
    <option>M</option>
    <option>L</option>
    <option>XL</option>
</select>

<table>
    <tr>
        <th>brand</th>
        <th>color</th>
        <th>size</th>
    </tr>
    <tr>
        <td><a href="#" class="click">nike</a></td>
        <td>red</td>
        <td>45</td>
    </tr>
    <tr>
        <td colspan="3">...more rows here...</td>
    </tr>
</table>
4

1 回答 1

0

首先，我建议更改您的标记，为颜色和大小表格单元格提供类，如下所示：

<tr>
    <td><a href="#" class="click">nike</a></td>
    <td class="color">red</td>
    <td class="size">L</td>
</tr>

此外，要更改下拉列表的值，您需要包含每个选项的值，如下所示：

<select id="size" name="size">
    <option value="M">M</option>
    <option value="L">L</option>
    <option value="XL">XL</option>
</select>

然后，在填充输入字段的 javascript 函数中，您可以将大小和颜色的值分配给变量。因为 .click 元素是表格单元格元素的子元素，它是大小和颜色单元格的同级元素，所以我们需要选择 .click 的父元素，然后选择同级元素：

var color = $(this).parent().siblings('.color').text();
var size = $(this).parent().siblings('.size').text();
$("#color").val(color);
$("#size").val(size);

这样做。然后，您只需使用相同的标记填写其余行，如下所示：

<tr>
  <td><a href="#" class="click">adidas</a></td>
  <td class="color">blue</td>
  <td class="size">XL</td>
</tr>
于 2012-09-29T14:10:16.353 回答