1

我有一个表格，可以输出分配给项目的系统。系统是循环的，并且可以动态添加新行，因此使用 ID 属性不可用。

当用户更改状态下拉选项时，我需要关联的状态影响日期字段成为必填项。我不知道如何足够好地遍历 DOM 以使用 datepicker 类定位字段。

<tr>  
    <th class="form">
        <label>Status</label>
    </th>  
    <td>
        <div style="float:left;">  
        <select class='status' name="status" >  
            <option value="New">New</option>  
            <option value="Existing">Existing</option>  
            and so on...  
        </select>  
        </div>
    </td>  
    <th class="form">
        <label>Status Eff. Date</label>
    </th>  
    <td>
        <div style="float:left;">  
            <input type="text" name="statuseffective" class="datepicker" size="15" >  
        </div>
    </td>  
</tr>

如果详细说明，该过程将如下所示：
当用户更改状态时，JS 将找到包含类 .datepicker 和 addClass('required') 的下一个输入字段，并将焦点设置到该字段（设置焦点是可选的，因为 addClass'required' 已经使该字段变为红色）。

我可以确定哪个下拉框发生了变化，我只是无法进入下一个输入元素。任何帮助，将不胜感激。

4

2 回答 2

1

在这里，我们开始...对我的答案进行编辑，因为我现在看到 .datepicker 与 .status 不在同一个父级下。

$(".status").live("click", function(){ $(this).parent().find('input.datepicker').addClass("required").focus(); )};

于 2011-04-20T17:10:28.823 回答
1 
$('.status').change(function(){
    $(this).next('input.datepicker').addClass("required").focus();
});

Should do the trick.

Update

Ok so... because both do not have the same parent you have to go up a level. next only finds the direct next element, nextAll finds all of the elements (at the same dom level it looks like). Testing a bunch of different ways of doing it and came up with this:

$('.status').change(function(){
    $(this).parents('td').nextAll("td:first").find('.datepicker').focus()
});

That should do the trick for ya!

于 2011-04-20T17:15:56.860 回答