Chrome 选择框在页面加载时未显示所选值答案

【问题标题】：Chrome select box not displaying the selected value on page loadChrome 选择框在页面加载时未显示所选值
【发布时间】：2013-08-28 07:36:24
【问题描述】：

这个继续让我陷入循环......只有在 Chrome 中才会发生这种情况。

我有一个“升级页面”，用户可以在其中单击计划，然后转到表单。我在这里传递 ?plan=# ，然后让它选择适合的选项。出于某种原因，在 Chrome 中，它正在选择它，因为它显示在检查元素中......但是，它不会显示在选择框中。

我正在尝试多种不同的方法在 chrome 中使用 jquery、php、html 以及我能想到的任何东西，但似乎没有任何效果。

这里是jquery代码：

$(document).ready(function() {
    var split = location.search.replace('?', '').split('=')
    var getPlan = split[1];
    console.log(getPlan);
    if (getPlan == 1) {
        $("#memberPlan").val('premium');
    } else {
        $("#memberPlan").val('vip');
    }

    function vip() {
        var list = "";        
        list = "<option value=\"3\">VIP: per month ($9.00)</option>\n";
        list += "<option value=\"4\">VIP: every 6 months ($47.00)</option>\n";
        list += "<option value=\"5\">VIP: per year ($89.00)</option>\n";
        $("#service").html(list);
    }
    function premium() {
        var list = "";        
        list = "<option value=\"0\">Premium: per month ($5.00)</option>\n";
        list += "<option value=\"1\">Premium: every 6 months ($27.00)</option>\n";        
        list += "<option value=\"2\">Premium: per year ($49.00)</option>\n";
        $("#service").html(list);
    }

    var currentPlan = $("#currentPlan").text().toLowerCase();
    $('#memberPlan').attr("value", currentPlan);

    if ($("#memberPlan").val() == "premium") {
        premium();
    }
    if ($("#memberPlan").val() == "vip") {
        vip();
    }
    $("#memberPlan").change(function() {
        if ($("#memberPlan option:selected").val() == 'vip'){
            vip();
        }
        if ($("#memberPlan option:selected").val() == 'premium'){
            premium();
        }
    });
});

这里是 html/php（$payPlan 是 $_GET['plan']）：

<select name="member_plan" id="memberPlan">
    <option value="premium"<?php echo $payPlan == 1 ? ' selected':''; ?>>Premium</option>
    <option value="vip"<?php echo $payPlan == 2 ? ' selected':''; ?>>VIP</option>
</select>

在此先感谢，任何帮助表示赞赏:)

【问题讨论】：

您确定 url 中的 plan 中会有值 1 或 2 吗？

标签： php jquery html google-chrome

【解决方案1】：

试试这个

 $("#memberPlan").change(function() {
    if ($(this).val() == 'vip'){
        vip();
    }
    if ($(this).val() == 'premium'){
        premium();
    }
});

【讨论】：

【解决方案2】：

有时我发现“on”处理程序以更一致的行为绑定到元素。试试？

$("#memberPlan").on('change', function() {
    if ($(this).val() == 'vip'){
        vip();
    }
    if ($(this).val() == 'premium'){
        premium();
    }
});

【讨论】：