亚洲在线久爱草,狠狠天天香蕉网,天天搞日日干久草,伊人亚洲日本欧美

為了賬號安全,請及時綁定郵箱和手機立即綁定
已解決430363個問題,去搜搜看,總會有你想問的

啟用/禁用多個輸入字段 JS 的更有效方法

啟用/禁用多個輸入字段 JS 的更有效方法

aluckdog 2021-09-30 13:58:59
問題:我有提交字段列表的表單。我的表單包括 2 個“覆蓋”字段:計數器 - 要提交的項目數量字段覆蓋 - 如果填充它假設覆蓋表中具有相同值的所有輸入最后我有 5 個字段輸入(field_1、field_2、field_3、field_4 和 field_5)。我想做的是:計數器 - 當填充時,它將禁用字段_數字低于計數器中的值,例如。當 counter = 3 時,輸入 field_4 和 field_5 將被禁用。field_0 - 當為空時,我希望用戶能夠在表中填寫任何內容。填充后,我希望將 field_0 復制到表中的所有單元格。我做了什么:我目前的工作代碼效率極低。我有一個復雜的“if”語句,它逐個檢查每個項目(field_1 - field_5)的 counter 和 field_0,并將它們設置為啟用/禁用或復制 field_0 值。我還有“clearFieldClass”函數,它在更改 field_0 時清除所有類“field”的項目。雖然它適用于 5 個字段和一個字段類型,但頁面的最終版本將有 200 個字段 x 10 個不同的類。我試圖避免讓 2000 行代碼做基本相同的事情。
查看完整描述

1 回答

?
MYYA

TA貢獻1868條經驗 獲得超4個贊

從您的 html 中刪除 onchange 屬性并使用以下代碼:


 document.querySelector('form').addEventListener('change', () => {

   document.querySelectorAll('.field').forEach((_el, index) => {


 if(!isNaN(+counter.value) && +counter.value != 0  && index + 1 > +counter.value){

  _el.disabled = 'disabled';

  _el.value = '';

  console.log('in')

 }


 else{

  _el.removeAttribute('disabled');

  _el.value = field_0.value;

 }

   });

 })


查看完整回答
反對 回復 2021-09-30
  • 1 回答
  • 0 關注
  • 208 瀏覽
慕課專欄
更多

添加回答

舉報

0/150
提交
取消
微信客服

購課補貼
聯系客服咨詢優惠詳情

幫助反饋 APP下載

慕課網APP
您的移動學習伙伴

公眾號

掃描二維碼
關注慕課網微信公眾號