Question

我有一个jQuery UI滑块。所有这些都很适合使用此代码：

表格

<div class="ui-slide" id="test_div" min="1" max="20" inc="1"></div>
<input readonly="readonly" name="padding" id="padding" type="text" value="5" />

这是我用来获取文本字段值的JavaScript代码：

JS代码

$('div.ui-slide').each(function(i){

    if( $(this).attr('min') != undefined && $(this).attr('max') != undefined ) {

        $(this).slider( { 
                        min: parseInt($(this).attr('min')), 
                        max: parseInt($(this).attr('max')), 
                        value: parseInt($(this).next("input").val()),
                        step: parseInt($(this).attr('inc')) ,
                        slide: function( event, ui ) {
                            $( this ).next("input").val(ui.value);
                        }
                    });

        $(this).removeAttr('min').removeAttr('max').removeAttr('inc');

    }

});

问题：

我需要将滑块和文本字段放在一个表中，特别是每个都在自己的“td”中。当我这样做时，我不能再使用上面的JS代码检索文本字段的值。

<table><tbody><tr>
<td><div class="ui-slide" id="test_div" min="1" max="20" inc="1"></div></td>
<td><input readonly="readonly" name="padding" id="padding" type="text" value="5" /></td>
</tr></tbody></table>

Chrome开发工具给了我这个错误。

未捕获的TypeError：无法调用未定义的方法'addClass'

我认为这与这行代码有关：

value: parseInt($(this).next("input").val()),

我不确定如何在表格单元格中获取下一个“输入”的值。

Answer 1

而不是过度使用next()在表格行中找到正确的输入元素：

parseInt($(this).closest("tr").find('input[name="padding"]').val()),

jQuery docs：

http://api.jquery.com/closest/

选择下一个输入字段（jQuery）

1 个答案: