在 Select 選項中獲取 Span class 的值

Question

我知道它可能看起來是重復的，但事實並非如此。

這是我的 select 的樣子：

<select id="avpMy4Y7E4cH_-iIRmmAK6-2GsEOu6Sjr-0-0"> 
 <option value="1Ltr [ <span class=money>Rs.1,495.00</span> ]">...</option> 
</select>

我只想獲得 class “錢”的價值。

這是我嘗試過的：

var val = $('#avpMy4Y7E4cH_-iIRmmAK6-2GsEOu6Sjr-0-0 option:selected').find('.money').val();

但這返回空值。

我怎樣才能得到那個特定的價值？

Answer 1

我有點不清楚你想要返回什么，但這將返回 span 的textContent以及classNames 。 Span 元素沒有值屬性。

您可以使用DOMParser將選定的選項文本轉換為 HTML 文檔、select 文檔中與該選擇器匹配的元素，並提取textContent

 window.addEventListener("DOMContentLoaded", () => { const opt = document.querySelector('#avpMy4Y7E4cH_-iIRmmAK6-2GsEOu6Sjr-0-0 option:checked'); const parser = new DOMParser(); //convert the value of the selected option to html document const htmldoc = parser.parseFromString(opt.value, "text/html"); //select all elements with className money from html document const moneys = htmldoc.querySelectorAll('.money'); //iterate each and display it's textContent moneys.forEach((a) => { console.log(a.textContent); //if you want to read the classNames a.classList.forEach((b) => { console.log(b); }); }); });

 <select id="avpMy4Y7E4cH_-iIRmmAK6-2GsEOu6Sjr-0-0"> <option selected value="1Ltr [ <span class=money>Rs.1,495.00</span> ]"></option> </select>