使用jquery在表中获取下一个单元格（在右侧）

EDIT Sorry for the mix up I was looking for the cell to the right >.<

编辑很抱歉混淆我正在寻找右边的单元格>。<

Hi just want to ask how to get the next cell (to the right) in the table using jquery. I tried using the alert(result) command to capture the result but it is giving me an undefined value. When getting the attribute of the div using alert(div) it is giving me the desired result.

嗨,我想问一下如何使用jquery获取表中的下一个单元格(右侧)。我尝试使用alert(result)命令来捕获结果,但它给了我一个未定义的值。当使用alert(div)获取div的属性时,它会给我所需的结果。

html

<div id='tab1' class='2nd_shift'>
    <table border='1' id='table_id' style='margin: 10px' ; cellpadding='1' cellspacing='1' bordercolor='#333333' bgcolor='#C0CCD0'>
        <tr>
            <th><font size='2' face='Baskerville' id='systems' class='systems'>SYSTEMS</font></th>
            <th><font size='2' face='Baskerville' id='schedule' class='schedule'>SCHED</font></th>
            <th><font size='2' face='Baskerville' id='start_time' class='start_time'>START_TIME</font></th>
            <th><font size='2' face='Baskerville' id='end_time' class='end_time'>END_TIME</font></th>
            <th><font size='2' face='Baskerville'>DURATION</font></th>
            <th><font size='2' face='Baskerville'>DONE_BY</font></th>
            <th><font size='2' face='Baskerville'>REMARKS</font></th>
        </tr>
        <tr>
            <td><font size='2' color='red' face='Baskerville'><b>2ND SHIFT</b></font></td>
        </tr>
        <tr>
            <td><font size='1' face='Baskerville'></font></td>
            <td><font size='1' face='Baskerville'></font></td>
            <td><input type='text' style='width: 120px' font size='1' face='Baskerville' onclick='youClickStart()' class='start_time' id=''></font></td>
            <td><input type='text' style='width: 120px' font size='1' face='Baskerville' onclick='youClickEnd()' class='end_time' id=''></font></td>
            <td><font size='1' face='Baskerville'></font></td>
            <td><font size='1' face='Baskerville'></font></td>
            <td><input type='text' style='width: 120px' font size='1' face='Baskerville' class='remarks' id=''></font></td>
        </tr>
        </tr>
    </table>
</div>

Javascript

$(document).ready(function () {
    $('.remarks, .start_time, .end_time').blur(function () {
        var div = $(this).parent().closest('div').attr('class');
        var column = $(this).attr('class');
        var id = $(this).attr('id');
        var getval = $(this).val();
        $('#getdiv').val(div);
        $('#getcolumn').val(column);
        $('#getid').val(id);
        $('#getvalue').val(getval);
        /*condition*/
        if (column == 'end_time') {}
        if (column == 'start_time') {
            var result = $(this).closest('td').next().attr('.class');
            alert(result);
            alert(div);
        }
    });
});

Thanks in advance =)

在此先感谢=)

2 个解决方案

#1

There are two issues:

有两个问题:

var result = $(this).closest('td').next().attr('.class');

You're trying to get the attribute called .class - notice the dot. You want the attribute called class.

你正试图获得名为.class的属性 - 注意点。您需要名为class的属性。

The next element just has the HTML <td> so there aren't any classes on it; you'll probably get an empty string returned when you fix the first problem.

下一个元素只有HTML ,因此没有任何类;修复第一个问题时,你可能会得到一个空字符串。

In addition to that, your HTML looks incorrect. You're creating an <input> element, but then you have a </font> tag immediately after it.

除此之外,您的HTML看起来不正确。您正在创建一个元素,但之后会有一个标记。

#2

The next column to the left is the previous element, so use .prev()

左边的下一列是前一个元素,所以使用.prev()

var result = $(this).closest('td').prev().attr('class');

#1