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

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

MDC Web:mdc-select 在更改時更新隱藏的輸入值(非本機選擇框)

MDC Web:mdc-select 在更改時更新隱藏的輸入值(非本機選擇框)

慕絲7291255 2022-07-01 16:54:01
到目前為止,在 MDC Web Components 方面做得很好,但我已經在這里掛了太久了。(在 JS 中不強。)mdc-select 曾經是非本地的,然后使用本地 HTML 選擇,現在它又是非本地的。有一段時間,MDC Web 支持隱藏輸入,以便您可以將值傳遞給服務器。我需要為同一頁面上的多個選擇框設置/更新 MDCSelect 更改上隱藏輸入的值......我可以讓它為一個選擇框執行此操作,但不是多個。這是選擇框 HTML:<div class="mdc-select mdc-select--outlined region-select">  <div class="mdc-select__anchor demo-width-class">    <i class="mdc-select__dropdown-icon"></i>    <div id="demo-selected-text" class="mdc-select__selected-text" tabindex="0" aria-disabled="false" aria-expanded="false"></div>    <div class="mdc-notched-outline">      <div class="mdc-notched-outline__leading"></div>      <div class="mdc-notched-outline__notch" style="">        <label id="outlined-label" class="mdc-floating-label" style="">Region</label>      </div>      <div class="mdc-notched-outline__trailing"></div>    </div>  </div>  <div class="mdc-select__menu mdc-menu mdc-menu-surface demo-width-class">    <ul class="mdc-list">      <li data-value="" disabled="" aria-selected="false" role="option" class="mdc-list-item" tabindex="0"></li>      <li data-value="north" aria-selected="false" role="option" class="mdc-list-item" tabindex="-1">North</li>      <li data-value="east" aria-selected="false" role="option" class="mdc-list-item" tabindex="-1">East</li>      <li data-value="south" aria-selected="false" role="option" class="mdc-list-item" tabindex="-1">South</li>      <li data-value="west" aria-selected="false" role="option" class="mdc-list-item" tabindex="-1">West</li>    </ul>  </div><!-- THIS IS THE HIDDEN INPUT THANK YOU --><input type="hidden" id="name2" name="input_name2" value="" class="my_mdc-select__value" /></div>我嘗試使用 id、name 甚至類來定位隱藏的輸入。我想我需要某種集成功能,forEach 或循環 - 嘗試在每個選擇下添加 JS 無濟于事。我已經處理了其他用戶的示例(見下文),但沒有成功。JavaScript 不是我的事,我知道它應該發生什么,但不知道函數或循環語法等來完成這項工作。我需要確保每個設置/更新都針對與該特定選擇框關聯的正確隱藏輸入。請幫忙!這個特殊問題自 1 月份以來一直存在(人們很久以前就在苦苦掙扎),沒有明確的解決方案來幫助非 JS 開發人員實現 MDCSelect 框。提前致謝!
查看完整描述

1 回答

?
長風秋雁

TA貢獻1757條經驗 獲得超7個贊

問題在這里:

document.querySelector('input.my_mdc-select__value').value = select.value;

Document.querySelector將在整個文檔中找到第一個匹配的元素,因此在您的循環中,您總是訪問相同的input元素。

相反,您應該在每個隱藏輸入的父元素上運行querySelector方法,在您的循環中將如下所示:

selectEl.querySelector('input.my_mdc-select__value').value = select.value;


查看完整回答
反對 回復 2022-07-01
  • 1 回答
  • 0 關注
  • 203 瀏覽
慕課專欄
更多

添加回答

舉報

0/150
提交
取消
微信客服

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

幫助反饋 APP下載

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

公眾號

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