您好,登錄后才能下訂單哦!
這篇文章主要介紹“jquery如何監聽select的改變”的相關知識,小編通過實際案例向大家展示操作過程,操作方法簡單快捷,實用性強,希望這篇“jquery如何監聽select的改變”文章能幫助大家解決問題。
監聽步驟:1、利用change()給select元素綁定改變事件,并設置事件處理函數,語法“$("select").change(function() {...});”;2、在事件處理函數中,設置事件觸發后需要執行的代碼,語法“alert("選項已被改變");console.log($('select').val());”,當發生改變后,會彈窗提醒,并獲取新選項內容。
本教程操作環境:windows7系統、jquery3.6.1版本、Dell G3電腦。
在jquery中,可以利用自帶的監聽函數change()來監聽select的改變。
當元素的值改變時發生 change 事件(僅適用于表單字段)。
change() 方法觸發 change 事件,或規定當發生 change 事件時運行的函數。
注意:當用于 select 元素時,change 事件會在選擇某個選項時發生。
實現步驟
步驟1:利用change()給select元素綁定改變事件,并設置事件處理函數
$("select").change(function() { //事件觸發后,執行的代碼 });
步驟2:在事件處理函數中,設置事件觸發后需要執行的代碼
$("select").change(function() { alert("選項已被改變"); console.log($('select').val()); });
這樣在select發生改變后,會彈窗提醒,并獲取新選項內容
實現代碼:
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <script src="js/jquery-3.6.1.min.js"></script> <script> $(document).ready(function() { $("select").change(function() { alert("select已改變"); console.log($('select').val()); }); }); </script> </head> <body> <div id="cont"> <select> <option value="目的地">目的地</option> <option value="溫州">溫州</option> <option value="永嘉">永嘉</option> </select> </div> </body> </html>
關于“jquery如何監聽select的改變”的內容就介紹到這里了,感謝大家的閱讀。如果想了解更多行業相關的知識,可以關注億速云行業資訊頻道,小編每天都會為大家更新不同的知識點。
免責聲明:本站發布的內容(圖片、視頻和文字)以原創、轉載和分享為主,文章觀點不代表本網站立場,如果涉及侵權請聯系站長郵箱:is@yisu.com進行舉報,并提供相關證據,一經查實,將立刻刪除涉嫌侵權內容。