允許的數(shù)字間隔由 HTML 輸入類型步驟屬性確定。步驟是數(shù)字步驟，例如 0、2、4、6、8 等。要構(gòu)造有效值范圍，請將 step 屬性與 max 和 min 屬性結(jié)合起來。
它們在一定范圍內(nèi)建立步進(jìn)間隔，通過從左向右移動滑塊或上下移動微調(diào)器來執(zhí)行該步進(jìn)間隔。如果沒有明確提及，默認(rèn)步驟將分配給各種輸入值。
語法
<input type="type name" step="number">
登錄后復(fù)制
不同輸入值的默認(rèn)步長值如下 –
| 輸入類型 | 值 | 示例 |
|---|---|---|
| 日期 | 1天 | |
| 月 | 1個月 | |
| 周 | 1周 | |
| 時間 | 60 秒 | |
| 本地日期時間 | 1秒 | |
| 數(shù)字 | 1 | |
| 范圍 | 1 |
我們將使用 jQuery 在 HTML 的一個范圍輸入中提供不同的步驟屬性。以下是示例…
示例
在下面的示例中，我們創(chuàng)建了不同的步驟，如果值為 <1995，則將當(dāng)前步驟設(shè)置為 20，將其他步驟設(shè)置為 1。
<!DOCTYPE html>
<html>
<head>
<script src="https://code.jquery.com/jquery-2.2.3.min.js"></script>
<script>
$(function() {
$('#years').on('input change', function() {
var
element = $('#years'),
value = element.val(),
step;
if (value < 1995) {
step = 20;
}
else {
step = 1;
}
element.attr('step', step);
$('#value').text(value);
$('#step').text(step);
});
});
</script>
</head>
<body>
<div>
Current value: <span id="value"></span>
</div>
<div>
Current step: <span id="step"></span>
</div>
<div>
<input id="years" type="range" value="1965" min="1965" max="2015" />
</div>
</body>
</html>
登錄后復(fù)制
執(zhí)行時上面的腳本，將分為兩個步驟。一步為20；范圍是從(1965-1994)，另一個是步驟1，范圍是從(1995-2015)。
以上就是如何在HTML中使用不同的步長屬性來使用一個范圍輸入？的詳細(xì)內(nèi)容，更多請關(guān)注www.92cms.cn其它相關(guān)文章！
