<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.0/jquery.min.js"></script>
<style>
.corners:active, .corners:hover, .corners:focus{
outline: none !important;
outline-offset: 0;
}
</style>
</head>
<body>
<input class="corners" type="range" min="0" max="10" step="1" value="0">
<span>0</span>
<script type="text/javascript">
window.onload=function(){
var pointer = $(".corners"),
blockText = $("span");
pointer.on("input", function () {
pointerValue = pointer.val();
console.log("$this.pointer.val() = " + pointer.val());
blockText.text(pointerValue);
if(pointerValue==10){
if (confirm("Are you crazy?")) {
alert("you chose number 10")
}else{
pointer.val(9);
}
}
})
}
</script>
</body>
</html>
.val(newVal) атрибуту value будет присвоено значение newVal, у всех выбранных элементов. Ок с этим вроде бы разобрался. Правда оно всё равно не работает. После вызова значение все равно становится равно 10
Сообщение от Dilettante_Pro
|
Black_Star,
и поменяйте обработчик input на change
|
Чем change лучше?
И ещё как быть что б не было "прилипания" курсора к ползунку?