我有下面的HTML代碼,我想在輸入字段中有輸入時使用字段的ID調用一個函數,而不管輸入字段的編號。
<input type="text" pattern="[0-9]*" name="code" maxlength="1" autofocus="autofocus" id="input1" class="input1"/>
<input type="text" pattern="[0-9]*" name="code" maxlength="1" id="input2" class="input2"/>
<input type="text" pattern="[0-9]*" name="code" maxlength="1" id="input3" class="input3"/>
<input type="text" pattern="[0-9]*" name="code" maxlength="1" id="input4" class="input4"/>
代替下面的,我想為所有調用一個函數。
$("#input1").on('input', function () {
console.log("this is input1");
});
$("#input2").on('input', function () {
console.log("this is input2");
});
$("#input3").on('input', function () {
console.log("this is input3");
});
$("#input4").on('input', function () {
console.log("this is input4");
});
您可以使用此選擇器來定位您的所有輸入$('input[id^=input]').
input[id^=input]意味著它將處理所有輸入,其中輸入的id以input開頭
$("input[id^=input]").on('input', function() {
console.log("this is " + this.id);
});
$("input[id^=input]").on('input', function() {
console.log("this is " + this.id);
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<input type="text" pattern="[0-9]*" name="code" maxlength="1" autofocus="autofocus" id="input1" class="input1" />
<input type="text" pattern="[0-9]*" name="code" maxlength="1" id="input2" class="input2" />
<input type="text" pattern="[0-9]*" name="code" maxlength="1" id="input3" class="input3" />
<input type="text" pattern="[0-9]*" name="code" maxlength="1" id="input4" class="input4" />
很多方法。其中之一是選擇所有輸入并觸發輸入法
$("input").on("input", function (e) {
console.log("this is input", e.target.id);
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.0/jquery.min.js"></script>
<input type="text" pattern="[0-9]*" name="code" maxlength="1" autofocus="autofocus" id="input1" class="input1"/>
<input type="text" pattern="[0-9]*" name="code" maxlength="1" id="input2" class="input2"/>
<input type="text" pattern="[0-9]*" name="code" maxlength="1" id="input3" class="input3"/>
<input type="text" pattern="[0-9]*" name="code" maxlength="1" id="input4" class="input4"/>
jQuery $()查詢選擇器函數接受多個逗號分隔的選擇器。
$("#input1,#input2,#input3,#input4").on('input', function () {
console.log("this is input from input 1, 2, 3 and 4");
});
上一篇c# json 增刪改查
下一篇c語言的json封裝數據