h5 datalist標簽獲取值


今天使用datalist標簽時,想要獲得選中的值,發現使用datalist標簽上的val()輸出結果一直都是空的

后面改用配套的input獲得值

代碼如下

<!DOCTYPE html>
<html>

<head>
        <meta charset="UTF-8">
        <script src="https://cdn.staticfile.org/jquery/3.2.1/jquery.min.js"></script>
        <script>
                $(window).on('load', function () {
                        $('#check').click(function () {
                                alert($("#datalist_1").val());
                                alert($("#txt_1").val());
                        });
                }); 
        </script>
</head>

<body>
        <input id="txt_1" list="datalist_1" />

        <datalist id="datalist_1">
                <option data-id="data_1" value="val_1"></option>
                <option data-id="data_2" value="val_2"></option>
                <option data-id="data_3" value="val_3"></option>
        </datalist>
        <button id="check">check</button>
</body>

</html>


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM