手记

Bootstrap中动态填充数据事件未触发解决方案

<script src="html/js/jq.js"></script>
<script>
    $(function () {
        $.ajax({
            type : "get",
            url : "playback/listUser",
            async : false,
            success : function(result){
                var temp="";
                for(x in result){
                    //x表示是下标,来指定变量,指定的变量可以是数组元素,也可以是对象的属性。
                    temp+="<li>"+result[x].username+"</li>";
                    console.log(result[x].username);
                }
                $(".simulate-option-list").append(temp+"" +
                        "<div class=\"simulate-option-list-top-bg\"></div><div class=\"simulate-option-list-bottom-bg\"></div> <div class=\"simulate-option-list-repeat-bg\"></div>");

            }
        });
    })
</script>
<script src="html/js/simulate_select_checkbox.js"></script>
<script src="html/js/tsm.js"></script>
<script src="html/js/utility.js"></script>
<!--<script src="html/js/api.js"></script>-->
<script src="html/js/range.js"></script>
<script src="html/js/picker/bdp.js"></script>
<script src="html/js/picker/bootstrap.js"></script>
<script src="html/js/replay.js"></script>
</html>
    <li >
                <label for="select-user">按账户:</label>
                <div class="simulate-select" simulate_select_name="user">
                    <div class="simulate-value" simulate_value>Glxss1</div>
                    <ul class="simulate-option-list">
                        <li>Glxss1</li>
                        <li>Glxss2</li>
                        <li>Glxss3</li>
                        <li>Glxss4</li>
                    </ul>
                </div>
            </li>

今天在做一个动态的下拉列表时发现一个问题,当我下拉选中某个节点时,
页面静态数据是可以触发change事件的。但是从后台动态拿来的就不行。
目前解决方案如

  1. 修改ajax 为同步请求
    2.js代码放置在bootstrap.js之前,要在bootstrap之前加载
    测试可用。
    另一种方案是修改bootstrap中下拉列表事件为动态绑定,工作量大不推荐
1人推荐
随时随地看视频
慕课网APP