javascript - 如何在弹出窗口的同一页面的下拉列表中创建带有预选选项的超链接?

标签 javascript jquery html

我正在尝试在弹出窗口中预先选择一个选项。我已经在互联网上进行了研究,这就是我到目前为止所得到的,但它不起作用。我现在总是预先选择第一个选项

超链接触发显示弹出窗口,其中应预先选择选项二。

<a href="?select=two" class="btn btn-red-2 show-modal" data-modal-id="order-form-modal">Order!</a>

模态窗口,该窗口将显示,并且应预先选择选项二。

<div id="order-form-modal" class="modal-window">
<select class="prettyform" name="select" id="select">
                            <option id="one" value="1" data-price="950">Nízke stojánky</option>
                            <option id="two" value="2" data-price="1790">Vysoké stojánky</option>
                            <option id="three" value="3" data-price="990">Set přenosné kruhy</option>
                            <option id="four" value="4" data-price="790">Přenosné kruhy</option>
                            <option id="five" value="5" data-price="490">Popruhy na kruhy</option>
                        </select>
</div>

JavaScript 应该解析开头超链接中给出的参数。

<script>
    $(document).ready(function() {
        var select = GetUrlParameter("select");
        $("#" + select).attr("selected", "");
    });

    function GetUrlParameter(name) {
            var value;
            $.each(window.location.search.slice(1).split("&"), function (i, kvp) {
                    var values = kvp.split("=");
                    if (name === values[0]) {
                            value = values[1] ? values[1] : values[0];
                            return false;
                    }
            });
            return value;
    }
</script>

最佳答案

您需要将option上的selected属性设置为true:

var select = GetUrlParameter("select");
$("#" + select).prop("selected", true);

Example fiddle

关于javascript - 如何在弹出窗口的同一页面的下拉列表中创建带有预选选项的超链接?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/33911508/

相关文章:

html - 具有两种颜色的 CSS3 按钮

php - 如何使用 html 表单的输入根据显示的结果更新 sql 表中的字段,这些结果本身就是 sql 查询的输出?

javascript - jquery中的一个div两个函数

javascript - 尝试使用表格作为数据库来更新 WooCommerce 中的价格

javascript - 如何在模态中传递 php 值? Bootstrap 3,

javascript - jquery延迟文档准备好功能的秒数?

javascript - 如何在点击时显示div?

javascript - 带进度条的倒数计时器

javascript - 在选择选项中使用 @click - Vue.js 2

javascript - 使用 jquery 从 javascript 加载 .txt 文件