Javascript 如何使用Jquery从HTML下拉列表中获取值

我有一个下拉列表，我想在选择下行列表的值时从数据库中检索数据。这是没有错误的工作。但当我点击下拉列表时，这是有效的，而不是在下拉值中。这意味着只能为默认值工作。请帮我纠正这个错误。代码如下

下拉列表的HTML代码

<select name="lab_no" id="lab-no" class="form-control">
    <option value="Lab 01" >Lab 01</option>
    <option value="Lab 02">Lab 02</option>
</select> 

实验室01
实验室02

Jquery代码在这里

<script type="text/javascript">
    $(document).ready(function () {
        $("option").click(function () {
            var txt = $("#lab-no:selected").val();
            if (txt = '') {

            } else {
                $('#table-row').html('');
                $.ajax({
                    url: "../svr/com-list.php",
                    method: "post",
                    data: {search: txt},
                    dataType: "text",
                    success: function (data) {
                        $('#table-row').html(data);
                    }
                });
            }
        });
    });
</script>

$（文档）.ready（函数（）{
$（“选项”）。单击（函数（）{
var txt=$（“#实验室编号：选定”）.val（）；
如果（txt=“”）{
}否则{
$（'#表行'）.html（''）；
$.ajax({
url:“../svr/com list.php”，
方法：“张贴”，
数据：{search:txt}，
数据类型：“文本”，
成功：功能（数据）{
$（'#表行'）.html（数据）；
}
});
}
});
});

您应该这样尝试

1.您需要更改jquery事件

    <script type="text/javascript">
       $(document).ready(function () {
        $("#lab-no").change(function () {
          var txt = $("#lab-no").val();
             alert(txt) //place alert and check value. You will get values which you have selected
             if (txt == '') { //make changes here

             } else {
               $('#table-row').html('');
                 $.ajax({
                  url: "../svr/com-list.php",
                   method: "post",
                   data: {search: txt},
                   dataType: "text",
                   success: function (data) {
                      $('#table-row').html(data);
                    }
               });
           }
        });
   });
 </script>

$（文档）.ready（函数（）{
$（“#实验室编号”）.更改（功能（）{
var txt=$（“#实验室编号”）.val（）；
警报（txt）//放置警报并检查值。您将获得所选的值
如果（txt=''）{//在此处进行更改
}否则{
$（'#表行'）.html（''）；
$.ajax({
url:“../svr/com list.php”，
方法：“张贴”，
数据：{search:txt}，
数据类型：“文本”，
成功：功能（数据）{
$（'#表行'）.html（数据）；
}
});
}
});
});

尝试使用

$（“#实验室编号”）。更改

。这样，您的事件将在您更改下拉列表后触发

您不应该在

$（“#实验室编号：选定”）.val（）中使用
:selected
，因为它不是必需的<代码>$（“#实验室编号”）.val（）

将返回所选值

工作演示

$（文档）.ready（函数（）{
$（“#实验室编号”）.更改（函数（）{
var txt=$（“#实验室编号”）.val（）；
console.log（txt）
如果（txt=“”）{
}否则{
$（'#表行'）.html（''）；
$.ajax({
url:“../svr/com list.php”，
方法：“张贴”，
数据：{
“搜索”：txt
},
数据类型：“文本”，
成功：功能（数据）{
$（'#表行'）.html（数据）；
}
});
}
});
});

实验室01
实验室02
您可以通过以下简单方式使用：

var drpSelectedValue=$("#lab-no").val();

这可能对您有所帮助。
首先，您需要针对您的目标选择
$（“#实验室编号”）
并使用
change
事件，而不是
单击
。然后可以将选定的选项作为目标


$（文档）.ready（函数（）{
$（“#实验室编号”）.更改（功能（）{
var txt=$（“选择选项：选定”）.val（）
console.log（txt）
如果（txt=“”）{
}否则{
$（'#表行'）.html（''）；
$.ajax({
url:“../svr/com list.php”，
方法：“张贴”，
数据：{search:txt}，
数据类型：“文本”，
成功：功能（数据）{
$（'#表行'）.html（数据）；
}
});
}
});
});

实验室01
实验室02
var txt=$（“#实验室编号”）.val（）；相同的结果，未成功可能出现相同结果的重复，您希望得到哪个结果@对于University，我希望按如下方式从数据库检索数据：当我选择lab 01时，应显示计算机属于lab one，当选择lab 02时，应显示计算机属于lab II。但这两个时间都只显示lab 01 computerstry，如下所示
lab-02
，不在valuesAlert working中添加空间，但查询不工作，仅查询lab 01的工作，当选择lab 02结果与lab相同时01@EverythingWithUniverse如果运行我的示例，您可以看到它返回所选的值。请澄清我复制和粘贴的问题是什么，但当我选择lab 02时，结果与lab 01相同