-1

我已经尝试过类似这样的东西,还有许多其他变体,比如 2 小时......阅读了很多关于 SO 的线程,但找不到我正在搜索的内容......

我有一个这样的结构:JSFIDDLE

<tr><td></td><td><select name="startTime[]" class="startTime"></select></td></tr>
<tr><td></td><td><select name="endTime[]" class="endTime"></select></td></tr>
<tr><td></td><td><select name="startTime[]" class="startTime"></select></td></tr>
<tr><td></td><td><select name="endTime[]" class="endTime"></select></td></tr>
<tr><td></td><td><select name="startTime[]" class="startTime"></select></td></tr>
<tr><td></td><td><select name="endTime[]" class="endTime"></select></td></tr>
<tr><td></td><td><select name="startTime[]" class="startTime"></select></td></tr>
<tr><td></td><td><select name="endTime[]" class="endTime"></select></td></tr>

            <script>
            $( ".endTime" ).change(function() {

                $(this).prevUntil('.startTime:first').addClass('pink');
                //$(this).prev(".startTime").addClass('pink');
//$('.endTime').prev('.startTime').addClass('pink');
                //$(this).prevAll('.startTime:first');

            });
            </script>
            <style>
                .pink{background-color: pink;}
            </style>

但我不知道该怎么做......输入一些对我不起作用的代码,我尝试了更多组合......

我想要什么:最后我想从字段 endtime 和 starttime 中获取值,addClass 只是在那里表明应该发生的事情......

非常感谢您的时间和帮助!

4

3 回答 3

3

你需要尝试

$(this).closest('tr').prev().find('.startTime').addClass('pink');

演示:小提琴

于 2013-08-02T10:27:18.473 回答
1

尝试以下:

$(this).closest('tr').prevAll().find('.startTime').addClass('pink');

在这里工作小提琴:http: //jsfiddle.net/3APhH/2/

我希望它有所帮助。

于 2013-08-02T10:33:41.120 回答
1

看看prevUntil()实际做了什么:

获取所有前面的兄弟姐妹

您的选择没有兄弟姐妹。它是封闭的唯一孩子<td>。你想要的是向外遍历 DOM 到最近的 DOM <tr>,得到它的前一个兄弟,然后找到你的<select>内部。

$(this)
    .closest('tr')      // Find ancestor <tr> that is closest, ...
    .prev()             // ... then find its predecessor...
    .find('.startTime') // ... inside that predecessor, find the element with class `startTime` ...
    .addClass('pink');  // ... and finally colour it.

我认为如果您稍微整理/缩进您的 HTML 标记,它会变得更加清晰:

<tr>
    <td></td>
    <td>
        <select name="startTime[]" class="startTime"></select>
    </td>
</tr>
<tr>
    <td></td>
    <td>
        <select name="endTime[]" class="endTime"></select>
    </td>
</tr>
于 2013-08-02T10:34:40.520 回答