Question

我有一个滑块和一个文本输入。这是文本输入的默认值，我希望当我将滑块滑动到不同的百分比时，文本输入中显示的数字会发生变化。我想知道我应该使用哪个标签，我可以为它设置一个默认值，它不会受到更改结果的影响。我在jsfiddle中有它： http://jsfiddle.net/8DzCE/266/

<table id="foodaverage" style>
    <tr>
        <td align="center">Average amount</td>
        <td></td>
        <td><div id="foodcarb" style="display: inline;">carbon footprint( <p id="unit" style="font-size: 10px; display: inline;">tons CO<sub>2</sub>)</p></div></td>
    </tr>
    <tr>
        <td><div id="simpleslider" class="slide"></div></td>
        <td><div id="simplevalue" class="answer"></div></td>
        <td><input type="text" value="528" class="result" id="foodanswer" /></td>
    </tr>
    <tr>
        <td><div id="qslider" class="slide"></div></td>
        <td><div id="asimplevalue" class="answer"></div></td>
        <td><input type="text" value="423" class="result" id="foodanswer1" /></td>
    </tr> 

</table>

jquery的：

$(".slide").each(function(i,item){
    $(item).slider({
        value:50,
        min: 0,
        max: 100,
        slide: function(event, ui){
            var nextTD = $(this).closest("td").next();

            nextTD.html(ui.value + '&#37;');
            var percent=parseFloat(ui.value);
            var answer=nextTD.closest("td").next("input");
            var int=parseFloat(answer.val());
            answer.text(int * percent / 100);
        }
    });
});

Answer 1

看看这个updated fiddle。我相信你的选择器错误answer。我会说虽然这不是获取对象的最佳方法，但最好还是使用ID，OR类并通过父对象引用它们（去除所有最接近的，下一个等）。但是现在我只是将选择器更改为：

var answer = nextTD.closest("td").next("td").closest("td").children("input");

Here is an update per the comments below

如何根据滑块更改更改显示的文本

1 个答案: