站長資訊網(wǎng)
修改步驟：1、使用屬性選擇器選取原選中值，并利用attr()函數(shù)將選中狀態(tài)去除，語法“$("[selected]").attr("selected", false);”；2、通過id屬性值獲取指定option元素，并利用attr()函數(shù)給該元素設(shè)置選中狀態(tài)，語法“$("#id值").attr("selected", "selected");”。
前端（vue）入門到精通課程：進(jìn)入學(xué)習(xí)
本教程操作環(huán)境：windows7系統(tǒng)、jquery3.6.1版本、Dell G3電腦。
select 元素可創(chuàng)建單選或多選菜單。
option 元素定義下拉列表中的一個(gè)選項(xiàng)（一個(gè)條目）。
瀏覽器將 <option> 標(biāo)簽中的內(nèi)容作為 <select> 標(biāo)簽的菜單或是滾動(dòng)列表中的一個(gè)元素顯示。
jquery修改select選中值的方法
在jquery中，可以通過給指定option元素添加selected屬性來修改select選中值。
| 屬性 | 值 | 描述 |
|---|---|---|
| selected | selected | 規(guī)定選項(xiàng)（在首次顯示在列表中時(shí)）表現(xiàn)為選中狀態(tài)。 |
實(shí)現(xiàn)步驟：
步驟1、使用屬性選擇器選取原選中值，并利用attr()函數(shù)將選中狀態(tài)去除
$("[selected]").attr("selected", false);
步驟2、通過id屬性值獲取指定option元素，并利用attr()函數(shù)給該元素設(shè)置選中狀態(tài)
$("#id值").attr("selected", "selected");
實(shí)現(xiàn)示例代碼
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <script src="js/jquery-3.6.1.min.js"></script> <script type="text/javascript"> $(document).ready(function() { $("button").click(function() { $("[selected]").attr("selected", false); $("#opel").attr("selected", "selected"); }); }); </script> </head> <body> <select> <option>請選擇選項(xiàng)</option> <option value ="volvo">Volvo</option> <option value ="saab">Saab</option> <option id="opel" value="opel">Opel</option> <option value="audi">Audi</option> </select> <button>修改選中值為Opel</button> </body> </html>
說明：
attr() 方法可以設(shè)置被選元素的屬性和值。
設(shè)置單個(gè)屬性的語法
$(selector).attr(attribute,value)
| 參數(shù) | 描述 |
|---|---|
| attribute | 規(guī)定屬性的名稱。 |
| value | 規(guī)定屬性的值。 |
設(shè)置多個(gè)屬性/值對
為被選元素設(shè)置一個(gè)以上的屬性和值。
$(selector).attr({attribute:value, attribute:value ...})
| 參數(shù) | 描述 |
|---|---|
| attribute:value | 規(guī)定一個(gè)或多個(gè)屬性/值對。 |
【推薦學(xué)習(xí)：jQuery視頻教程、web前端視頻】
