关于select 在不同浏览器下的jquery操作兼容性问题

测试代码如下：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
<!--    <script src="res/js/jquery-1.12.3.js"></script>-->
    <script type="text/javascript" src="res/js/jquery-1.12.3.js"></script>
</head>
<body>
    <label>城市</label>
        <select id="city" >
            <option value=""></option>
            <option value="0">北京</option>
            <option value="1">上海</option>
            <option value="2">广州</option>
            <option value="3">深圳</option>
            <option value="4">杭州</option>
            <option value="5">成都</option>
        </select>
 
    <button class="btn" id="get_value">获取</button>
    <button class="btn" id="set_value">根据value设置</button>
    <button class="btn" id="set_text">根据text设置</button>
 
<script>
        $(".btn").click(function() {
            var id = $(this).attr('id');
            if (id == "get_value") {
                s1 = $("#city option:selected").text();//获取选中option文本
                alert(s1);
            }
            if (id === "set_value") {
                 $("#city").find("option[value='2']").attr("selected", true); //该方法在非IE浏览器下只能第一次有效(IE下面完全正常），原因为
              //  $("#city").val('2'); //根据value值选中option，这个是首选，简单高效
            }
            if (id === "set_text") {
                 $("#city option:contains(杭州)").attr("selected",true);  //貌似只能用一次(但在IE下面完全正常）
            }
    });
</script>
</body>
</html>

可以确定，相同的js操作不停切换，在IE下均正常。在Chrome下异常，只能工作一次。之前还以为是layui的锅。这次完全不用layui也这样。一切换IE浏览器就正常了。

posted @   IT情深  阅读(59)  评论(0)  编辑  收藏  举报
相关博文：
· layui select的使用及解决根据text找value遇到的bug
· layui button点击事件处理及动态创建绑定测试
· jQuery实现checkbox全选在IE浏览器中不兼容问题
· jquery实现的layui多级选择框联动
· js/jquery 关于select 的一些操作
阅读排行：
· DeepSeek 开源周回顾「GitHub 热点速览」
· 物流快递公司核心技术能力-地址解析分单基础技术分享
· .NET 10首个预览版发布：重大改进与新特性概览！
· AI与.NET技术实操系列（二）：开始使用ML.NET
· 单线程的Redis速度为什么快？
点击右上角即可分享
微信分享提示
AI FOR CODE 大赛