今天在使用avalon的项目中使用了两个组织关联的select标签

当选择省份时，自动加载下级城市列表的功能在ie下出现异常。

选择一个省份时，加载的上一个省份的城市列表。基本代码如下：

html

<select id="proselect" ms-duplex="provienceCode" ms-change="proChange">
    <option ms-repeat="provienceList" ms-attr-value="el.code">{{el.name}}</option> 
</select> 
<select ms-duplex="cityCode">
    <option ms-repeat="cityList" ms-attr-value="el.code">{{el.name}}</option>
</select>
vm = avalon.define({
    $id:"dd",
    provienceCode:"",
    cityCode:"",
    cityList: [],
    provienceList: [],
    proChange: function(){
        $.ajax({
            url: "/dict/" + vm.provienceCode,
            success: function (data) {
                console.log(data)
                //当选择省份列表中的item时，发现这里城市列表获取的是上一个省份的城市列表
                vm.cityList = data.data
            }
        })
    }
})

 

调试发现，在选中item，触发ms-change的函数发送请求时，vm.provienceCode发送的是改变之前的值。而不是改变之后的。

在ie下，ms-change会在绑定值改变之前被调用。

解决方法：

给select绑定id值，在js中直接获取该dom的value值，可以正常的处理。

 1     proChange: function(){
 2         $.ajax({
 3             url: "/dict/" + $("#proselect").val(),
 4             success: function (data) {
 5                 console.log(data)
 6                 //当选择省份列表中的item时，发现这里城市列表获取的是上一个省份的城市列表
 7                 vm.cityList = data.data
 8             }
 9         })
10     }

 

版权声明：本文为sunshengzhen原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://www.cnblogs.com/sunshengzhen/p/9597646.html