.html() 如何僅顯示 select 的選定選項？

Question

當我做 $("#form").html() 我的 output 是；

<select id="Select1" name="Select1">
<option value="Data1">Data1</option>
<option value="Data2">Data2</option>
<option value="Data3">Data3</option>
<option selected="selected" value="Data4">Data4</option>
</select>

但是當我調用.html() function 時，我只想像這樣獲得 select 的選定選項；

<select id="Select1" name="Select1">
<option selected="selected" value="Data4">Data4</option>
</select>

我怎么能用.html() function 做到這一點？

Answer 1

您可以使用選擇器獲得選定的選項：selected ： https://learn.jquery.com/using-jquery-core/faq/how-do-i-get-the-text-value-of-a-selected-option /

 let selectedOption = $("#form #Select1 option:selected"); let selectedOptionParent = selectedOption.parent()[0]; let selectedOptionTag = selectedOption[0]; let selectedOptionVal = selectedOption.val(); console.log(selectedOptionParent); console.log(selectedOptionTag); console.log(selectedOptionVal);

 <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> <form id="form"> <select id="Select1" name="Select1"> <option value="Data1">Data1</option> <option value="Data2">Data2</option> <option value="Data3">Data3</option> <option selected="selected" value="Data4">Data4</option> </select> </form>