如何从下拉列表中检索选定的值而不刷新页面或表单提交?

时间:2016-10-23 07:06:18

标签: php jquery html

我正在制作一个关于电子商务网站形式的品牌的下拉菜单,我必须输入产品。是否有可能在不使用提交按钮的情况下检索下拉列表的选定值。更好的是,我可以使用没有封闭元素的选择选项。 如果可以,我如何使用jquery检索下拉列表的值。

function getbrands_add_products(){
    global $con;
    try{
        $query = "select * from brands";
        $stmt = $con->prepare($query);

        $stmt->execute();
        $result = $stmt->fetchAll();

        echo "<option>Select Brand</option>";

        foreach ($result as $rows) {
            $brand_id = $rows['brand_id'];
            $brand_title = $rows['brand_title'];
            echo "<option value='$brand_id'>$brand_title</option>";
        }
    } catch(PDOException $e){
        echo "Error: ".$e->getMessage();
    }
}

这是我查询数据库并将其显示为下拉列表供用户选择的功能。如何在不使用表单提交的情况下访问所选值。如果是jquery,那就最好。

2 个答案:

答案 0 :(得分:0)

您可以在表单之外使用<select>但不是标准方式。

您可以使用javascript jquery访问该值。给它一个像

的id
<select id="select-box">
<option value = "something"></option>
....

然后在jquery上使用:

$("#select-box").on("change",function(){
    var value = $(this).val()
})

但它不是在表单

之外使用选择框的标准方法

答案 1 :(得分:0)

是的,您可以在没有<form>标记的情况下使用它。

实际上,您可以使用任何与<form>标记无关的表单相关元素。

如果您想使用<select> elemet选定值,可以使用select.onchange事件。

元素值是选中的选项值。

html代码:

<select id='select'>
    <option value='11'>
        testOption
    </option>
</select>

js代码:

var select = document.getElementById('select');
select.onchange = function () {
    var value = this.value;
    alert(value);
}