ajax调用后加载脚本或CDN

时间:2017-06-08 11:08:31

标签: javascript jquery html ajax

我正在尝试为多选下拉列表运行此ajax方法: -

success: function (data) {
            var drop_down_option = '<select name="langOpt3[]" multiple id="langOpt3">';

            var check = JSON.parse(data)
            console.log(check);
            for (var i in check) {
                console.log(check[i].branchId + ',' + check[i].validbranches);
                drop_down_option += '<option id="' + check[i].branchId +  '">' + check[i].validbranches + '</option>';
            }

            drop_down_option += '</select>';
            document.getElementById("checkID").innerHTML = drop_down_option;

        },
        async: false

当我在html上使用静态多选下拉列表时,它没有红框,图像显示如下: - Drop down which isn't working dynamically

哪些无效,显示在红框中: - Working static drop down

我正在使用的这些脚本: -

<link href="~/css/jquery.multiselect.css" rel="stylesheet" />
<script src="~/js/jquery.multiselect.js"></script>
<script src="/js/jquery.min.js"> </script>

我看到的问题是,如果动态我的脚本在页面加载之前运行,因此这个动态ajax不会显示下拉,但是在静态多选下拉它的工作原理是因为这个下拉列表是在页面加载之前,因此脚本会在它上面运行它如何在页面调用之前或这些脚本运行之前运行ajax。

1 个答案:

答案 0 :(得分:0)

在DOM中插入select标签后,只需在ajax成功方法中调用.selectMultiple事件函数

success: function (data) {
        var drop_down_option = '<select name="langOpt3[]" multiple id="langOpt3">';

        var check = JSON.parse(data)
        console.log(check);
        for (var i in check) {
            console.log(check[i].branchId + ',' + check[i].validbranches);
            drop_down_option += '<option id="' + check[i].branchId +  '">' + check[i].validbranches + '</option>';
        }

        drop_down_option += '</select>';
        document.getElementById("checkID").innerHTML = drop_down_option;

       $('#langOpt3').selectMultiple(
        //your code
       );

    }