jquery - 为什么jQuery显示错误的页面？

Question

这是 jQuery：

$(document).on('change', '.ui-slider-switch', function () {
    if ($(this).val() == 'on') {
        $("#content1").hide();
        $("#content2").show();
    }
    else {
        $("#content1").show();
        $("#content2").hide();
    }
});

我的 HTML：

<div id="switch" data-role="fieldcontain">      
    <select name="slider" id="flip-a" data-role="slider">
        <option value="off"></option>
        <option value="on"></option>
    </select>   
</div>

在我的站点中，我有时会使用自定义 URL（并使用 从中获取数据$ _GET）。当页面重新加载时，我总是得到$("#content2").show();而不是$("#content1").show();

Answer 1

尝试改变：

$(document).on('change', '.ui-slider-switch', function () {

至：

$(document).on('change', 'select[name=slider]', function () {

Answer 2

您确定事件处理程序中的代码正在运行吗？（即您是否使用alertorconsole.log或类似的东西对其进行了测试？）如果页面刚刚重新加载，并且没有人（人或代码）更改选择的值，则处理程序原则上不会运行。

我建议change在您的页面（或元素）完成加载后手动触发事件，这样将检查/双重检查正确的值：

$('.ui-slider-switch').trigger('change');

确保在页面刚刚完成重新加载后运行代码。