Metode implementasi HTML mendeteksi bahwa input telah selesai dan secara otomatis mengisi konten berikutnya

Pada artikel sebelumnya, kita baru menyadari bahwa input deteksi telah selesai. Kita telah mengimplementasikan input deteksi telah selesai. Sekarang kita melangkah lebih jauh. Atas dasar ini, kita dapat menyadari bahwa input deteksi telah selesai dan terisi secara otomatis konten berikutnya.

Ketika kita perlu mengisi konten secara otomatis dan tidak ingin diubah, kita perlu menambahkan atribut readonly.

Saat mengisi formulir reimbursement, Anda hanya perlu mengisi jumlah hari perjalanan bisnis dan besaran subsidi perjalanan bisnis akan dihitung secara otomatis.

Kodenya adalah sebagai berikut

 <tbody> <tr style=background-color:#FfFFFF> <th colspan=2 class=info>Subsidi perjalanan bisnis:</th> </tr> <tr style=background-color:#F3F3F3> <th>Nomor hari subsidi :</th> <td> <input class=form-control onBlur=finnishInput(event) onInput(event) id=travelAllowanceDaysId type=number placeholder=> </td> </tr> <tr style=background-color:#FFFFFF> <th>Jumlah subsidi:</th> <td> <input class=form-control id=travelAllowanceFeesId type=number placeholder= > </td> </tr></tbody>

Kode JavaScript:

 var bendera = 0; fungsi onInput(e) { console.log(Inputing); bendera = 1; $api.removeAttr($api.byId('travelAllowanceFeesId'), 'readonly');} fungsi finnishInput(e) { jika (1 == bendera) { console.log(InputOk); $api.byId('travelAllowanceFeesId').value = 400*$api.byId('travelAllowanceDaysId').value; $api.attr($api.byId('travelAllowanceFeesId'), 'hanya baca', benar }}

Hasilnya adalah sebagai berikut

Di atas adalah metode implementasi yang diperkenalkan editor kepada Anda untuk mendeteksi bahwa input HTML telah selesai dan secara otomatis mengisi konten berikutnya. Saya harap ini dapat membantu Anda. Jika Anda memiliki pertanyaan, silakan tinggalkan saya pesan dan editor akan membalas Anda tepat waktu. Saya juga ingin mengucapkan terima kasih kepada semua orang atas dukungan Anda terhadap situs seni bela diri VeVb!

Jika menurut Anda artikel ini bermanfaat bagi Anda, silakan cetak ulang, harap sebutkan sumbernya, terima kasih!