input type="number"
數字:
let $num = $('#number');
$num.on('change input',function (e) {//監聽改變和輸入事件
console.log($(this).val());
})

number.png
input type="range"
拖動範圍:
let $range = $('#range');
$range.on('change input', function (e) {//監聽改變和輸入事件
console.log($(this).val());
})
range.png
input type="date"
選擇日期:
let $date = $('#date');
$date.on('input', function (e) {//監聽輸入事件
console.log($(this).val());
})
date.png
type="color"
選取顔色:
let $color = $('#color');
$color.on('input', function (e) {//監聽輸入事件
console.log($(this).val());
})
color.png
select+option
選擇:
男
女
未知
let $select = $('#select');
$select.on('input', function (e) {//監聽輸入事件
console.log($(this).val());
})
select.png
search+資料
清單:
let $list = $('#list');
$list.on('input', function (e) {//監聽輸入事件
console.log($(this).val());
})
list.png