Question

我正在尝试使用JavaScript和jQuery的val方法验证范围输入类型。它输出到HTML很好，但不会在控制台中记录对值的更改（因为滑块被移动，控制台的日志保持在5）

HTML

<input type="range" min="1" max="10" step="1" value="5" id="slider" />
<div id="output"></div>

的JavaScript

  $(function(){  
    var val = $('#slider').val();  
        output  = $('#output');  

    output.html(val);  

    $('#slider').change(function(){  
        output.html(this.value); 
    });

    console.log(val);
    if(val === 1) {
      console.log('test');
    }

});

Answer 1

将记录器放入事件处理函数：

$('#slider').change(function(){
    var val = this.value;
    output.html(val); 
    console.log(val);
    if(val === 1) {
          console.log('test');
    }
});

Answer 2

将console.log()放在change事件处理程序中。

  $(function(){  
    var val = $('#slider').val();  
        output  = $('#output');  
        output.html(val);  

    $('#slider').change(function(){  
        output.html(this.value);
        console.log(this.value);
        if(this.value == 1) {
          console.log('test');
        }
    });
});

演示： http://jsfiddle.net/mx6QY/4/

.val对输入调整HTML但不改变控制台中的值

2 个答案: