Jquery 移动查找所选文本的选择 returns 错误

Question

我有一个包含多个 select 的简单 html 页面，在单击按钮时，我试图读取所有值 selected。我只得到第一个 select 的值，其余均为空。知道为什么会这样吗？

html 页

            $("#btnSearchIncidents").click(function () {
              

                console.log($("#ddlIncidentID").val());
              
                console.log($("#dhsIncidentId").val());
              
                console.log($("#districtNames").val());
              
                console.log($("#subdistrictNames").val());
              
                console.log($("#unitNames").val());
              
                console.log($("#incidentDate").val());
                
                });

<!DOCTYPE html>
<html>
    
    <head>
        <title>JQM latest</title>
        <meta charset="utf-8">
        <meta name="viewport" content="width=device-width, initial-scale=1">
        <link rel="stylesheet" href="http://code.jquery.com/mobile/git/jquery.mobile-git.css">
        <script src="http://code.jquery.com/jquery-1.10.2.js"></script>
        <script src="http://code.jquery.com/mobile/git/jquery.mobile-git.js"></script>
    </head>
    
    <body>
            <article data-role="content">
            <div id="divincidentformtitle1"></div>
            <div data-role="fieldcontainer">
                <label for="ddlIncidentID">Incident ID</label>
                <select id="ddlIncidentID" placeholder="Select Incident ID">
                    <option value="" disabled selected>Please Select an Incident ID</option>
                     <option value="volvo">Volvo</option>
  <option value="saab">Saab</option>
  <option value="mercedes">Mercedes</option>
  <option value="audi">Audi</option>
                </select>
            </div>
            <div data-role="fieldcontainer">
                <label for="ddlIncidentNbr">DHS Incident Number</label>
                <select id="ddlIncidentNbr" placeholder="Select Incident Number">
                    <option value="" disabled selected>Please Select an Incident Number</option>
                     <option value="volvo">Volvo</option>
  <option value="saab">Saab</option>
  <option value="mercedes">Mercedes</option>
  <option value="audi">Audi</option>
                </select>
            </div>
            <div data-role="fieldcontainer">
                <label for="ddlDistrict">District</label>
                <select id="ddlDistrict" placeholder="Select a district">
                    <option value="" disabled selected>Please Select a District</option>
                     <option value="volvo">Volvo</option>
  <option value="saab">Saab</option>
  <option value="mercedes">Mercedes</option>
  <option value="audi">Audi</option>
                </select>
            </div>
            <div data-role="fieldcontainer">
                <label for="ddlSubDist">Sub District</label>
                <select id="ddlSubDist" placeholder="Select a district">
                    <option value="" disabled selected>Please Select a Sub District</option>
                     <option value="volvo">Volvo</option>
  <option value="saab">Saab</option>
  <option value="mercedes">Mercedes</option>
  <option value="audi">Audi</option>
                </select>
            </div>
            <div data-role="fieldcontainer">
                <label for="ddlUnit">Unit</label>
                <select id="ddlUnit" placeholder="Select an Unit">
                    <option value="" disabled selected>Please Select a Unit</option>
                     <option value="volvo">Volvo</option>
  <option value="saab">Saab</option>
  <option value="mercedes">Mercedes</option>
  <option value="audi">Audi</option>
                </select>
            </div>
            <div data-role="fieldcontainer">
                <label for="dateofaccident">Incident Date</label>
                <select id="dateofaccident" placeholder="Select an Unit">
                    <option value="" disabled selected>Please Select an Incident Date</option>
                     <option value="volvo">Volvo</option>
  <option value="saab">Saab</option>
  <option value="mercedes">Mercedes</option>
  <option value="audi">Audi</option>
                </select>
            </div>
            <button id="btnSearchIncidents" data-theme="c">Search</button>
              </article>
    </body>

</html>

Answer 1

您给出的 id 错误 <select> element.The 以下代码是您代码的工作版本：

<!DOCTYPE html>
<html>
    
    <head>
        <title>JQM latest</title>
        <meta charset="utf-8">
        <meta name="viewport" content="width=device-width, initial-scale=1">
        <link rel="stylesheet" href="http://code.jquery.com/mobile/git/jquery.mobile-git.css">
        <script src="http://code.jquery.com/jquery-1.10.2.js"></script>
        <script src="http://code.jquery.com/mobile/git/jquery.mobile-git.js"></script>
  <script>
  $(function(){
    $(document).on("click","#btnSearchIncidents",function () {
              

                console.log($("#ddlIncidentID").val());
              
                console.log($("#dhsIncidentId").val());
              
                console.log($("#districtNames").val());
              
                console.log($("#subdistrictNames").val());
              
                console.log($("#unitNames").val());
              
                console.log($("#incidentDate").val());
                
                });
  });
      
  </script>
    </head>
    
    <body>
            <article data-role="content">
            <div id="divincidentformtitle1"></div>
            <div data-role="fieldcontainer">
                <label for="ddlIncidentID">Incident ID</label>
                <select id="ddlIncidentID" placeholder="Select Incident ID">
                    <option value="" disabled selected>Please Select an Incident ID</option>
                     <option value="volvo">Volvo</option>
  <option value="saab">Saab</option>
  <option value="mercedes">Mercedes</option>
  <option value="audi">Audi</option>
                </select>
            </div>
            <div data-role="fieldcontainer">
                <label for="dhsIncidentId">DHS Incident Number</label>
                <select id="dhsIncidentId" placeholder="Select Incident Number">
                    <option value="" disabled selected>Please Select an Incident Number</option>
                     <option value="volvo">Volvo</option>
  <option value="saab">Saab</option>
  <option value="mercedes">Mercedes</option>
  <option value="audi">Audi</option>
                </select>
            </div>
            <div data-role="fieldcontainer">
                <label for="districtNames">District</label>
                <select id="districtNames" placeholder="Select a district">
                    <option value="" disabled selected>Please Select a District</option>
                     <option value="volvo">Volvo</option>
  <option value="saab">Saab</option>
  <option value="mercedes">Mercedes</option>
  <option value="audi">Audi</option>
                </select>
            </div>
            <div data-role="fieldcontainer">
                <label for="subdistrictNames">Sub District</label>
                <select id="subdistrictNames" placeholder="Select a district">
                    <option value="" disabled selected>Please Select a Sub District</option>
                     <option value="volvo">Volvo</option>
  <option value="saab">Saab</option>
  <option value="mercedes">Mercedes</option>
  <option value="audi">Audi</option>
                </select>
            </div>
            <div data-role="fieldcontainer">
                <label for="unitNames">Unit</label>
                <select id="unitNames" placeholder="Select an Unit">
                    <option value="" disabled selected>Please Select a Unit</option>
                     <option value="volvo">Volvo</option>
  <option value="saab">Saab</option>
  <option value="mercedes">Mercedes</option>
  <option value="audi">Audi</option>
                </select>
            </div>
            <div data-role="fieldcontainer">
                <label for="incidentDate">Incident Date</label>
                <select id="incidentDate" placeholder="Select an Unit">
                    <option value="" disabled selected>Please Select an Incident Date</option>
                     <option value="volvo">Volvo</option>
  <option value="saab">Saab</option>
  <option value="mercedes">Mercedes</option>
  <option value="audi">Audi</option>
                </select>
            </div>
            <button id="btnSearchIncidents" data-theme="c">Search</button>
              </article>
    </body>

</html>

Jquery 移动查找所选文本的选择 returns 错误

Jquery Mobile finding selected text of selects returns error

jquery-mobile