操作后更改滑块上的指示器

Question

我有这个当前的滑动条：http://jsfiddle.net/z68mR/21/

我希望每次选中此框时，白色指示器都会移动到最右侧（值= 10）。目前，当我选中该框时，显示的值为10，但指标不会移动到10。

这是JS：

window.showValue = showValue;
var refreshIntervalId;
$('#refreshCheck').on('change', function () {
    if($("#refreshCheck").prop("checked")){
                alert("auto refresh on");
                showValue(10);

            }
    else{

                clearInterval(refreshIntervalId);
            }
        });

function refresh(time){
                clearInterval(refreshIntervalId);
                refreshIntervalId = setInterval(
                    function ()
                    {
    $("#area").text("Refreshed").fadeIn(300).fadeOut(300).fadeIn(300).fadeOut(300);
                    }, parseInt(time*1000));    
        }

    /* Refresh timer display */
function showValue(newValue){
            document.getElementById("range").innerHTML=newValue;
            refresh(newValue);

        }

Answer 1

尝试：

$('input[type=range]').val(10);

DEMO

如果你想要在chech / uncheck上移动指示器，只需添加

$('input[type=range]').val(10);

和else声明

DEMO2