1

我有一张这样布置的桌子：

        <td>
                somename
        </td>
        <td class="hoverable value" >
                somevalue
        </td>
        <td class="changed">

        </td>
        <td class="original value">
            <input type="hidden" value="somevalue" />
        </td>

而我想要做的是，我将鼠标悬停在可悬停的 td 上，它将它变成一个文本框。一旦我将鼠标悬停在外面，我想检查隐藏字段的原始值，如果 2 彼此不同，则将图像放入更改中。我已经有了这个：

$(document).ready( function() {
    var newHTML = '';

    $('table td.hoverable').hover(
    function () {
        var oldHTML = $(this).html().trim();
        $(this).html('<input type=\'text\' value=\'' + oldHTML + '\' size=\'' + ((oldHTML).length + 2) +'\' />');
    },
    function() {
        newHTML = $('input', this).val();
        var oldHTML = $(this).next('td.original').children('hidden').val();
       if(newHTML != oldHTML) {
            $(this).next('td.changed').html('Changed');
        }
        $(this).html(newHTML);
    })
});

但它不起作用。显然失败的是获取隐藏字段的值，我尝试以几种不同的方式选择它，但就是无法做到。任何想法或提示都将不胜感激；）

4

4 回答 4

5

您需要使用.nextAll()

var oldHTML = $(this).nextAll('td.original').find('input:hidden').val();

为什么？因为.next() 正在获取下一个元素并查看它是否与选择器匹配。如果您使用.nextAll()您将获得与选择器匹配的下一个元素。

于 2010-05-20T17:48:21.080 回答
1

尝试

$(this).next('td.original').find('input:hidden').val();
于 2010-05-20T17:27:31.863 回答
0 
var oldHTML = $(this).next('td.original').children(':hidden').val();
于 2010-05-20T17:27:44.437 回答
0

代替

var oldHTML = $(this).next('td.original').children('hidden').val();

和

var oldHTML = $(this).next('td.original').find('input:hidden').val();
于 2010-05-20T17:29:06.320 回答