Home  >  Q&A  >  body text

javascript - JQuery刷新页面,造成页面秒闪

我的页面中有个下拉框,然后会根据下拉框的内容用 JQery 来隐藏或显示部分元素。
但是在 IE 下,下拉框选择了数据以后再次进入这个页面,会先显示原来的页面,然后秒闪一下到新的 JQuery 隐藏显示过的页面。
怎么能让他不秒闪呢?
能不能不改页面元素,光修改 js 代码改好?

比如我的默认页面是这样的

图1

然后 yySelectBox 选择 aaa,页面变成这样

图2

但是保存以后,从别的页面再进入这个页面,就会先显示图1,然后闪一下变成图2

我的 JS 代码

$(function() {
    $("#yySelectBox").change(function() {
        if (aaa) {
            xxx.hide();
        } else {
            xxx.show();
        }
    }
}
大家讲道理大家讲道理2654 days ago444

reply all(4)I'll reply

  • 怪我咯

    怪我咯2017-04-10 15:52:33

    能不能不改页面元素,光修改 js 代码改好?

    不能,如果你不改变页面元素,不管怎样,第二个下拉框都是会先显示,然后js判断操作隐藏。
    好的方式是,你把保存的结果加到页面元素上。

    reply
    0
  • 大家讲道理

    大家讲道理2017-04-10 15:52:33

    你换个事件试试,jquery的change,是失去焦点的时候触发,很可能是触发了2次,你调试一下,是不是进入的2次这个方法 IE里面加个alert 试试.`$(function() {

    var i = 1; 
    $("#yySelectBox").change(function() {
    alert(i++)
        if (aaa) {
            xxx.hide();
        } else {
            xxx.show();
        }
    }

    }`

    reply
    0
  • 高洛峰

    高洛峰2017-04-10 15:52:33

    。。。你默认让 UI上右侧的内容先隐藏

    reply
    0
  • 巴扎黑

    巴扎黑2017-04-10 15:52:33

    //加载的时候先hide
    function checkSelect(value)
    {
        if(value == 'aaa')
            xxx.hide();
        else
            xxx.show();
    }
    $(function() {
        checkSelect($("#yySelectBox").val());
        $("#yySelectBox").change(function() {
            checkSelect($(this).val());
        }
    });

    reply
    0
  • Cancelreply