Question

我使用easydropdown.js来设置HTML选择的样式。问题是通过$ .post jquery动态选择填充，脚本不起作用。你知道怎么帮助我吗？感谢。

Answer 1

我们可以获取select个对象，修改其值，然后destroy并重新初始化为以下代码：

<select id="select-to-easydropdown" class="dropdown">
  <option value="option1">option 1</option>
  <option value="option2">option 2</option>
</select>

/* in js code with jquery */

var select = $("#select-to-easydropdown");

// process with select object (add/remove option)
select.append('<option value="option3">option 3</option>');

// destroy if existing easydropdown object
select.easyDropDown('destroy');

// init or re-init easydropdown
select.easyDropDown({
    onChange: function(selected){       
      // add change event listener
      ...
    }    
});

希望它有所帮助！

Answer 2

var choose = '<option value="0">choose...</option>';
        var wait = '<option value="0">wait...</option>';

        $("#select_2").html(choose);

        $("#select_3").html(choose);



        $("#select_1").change(function(){
            var val_select_1 = $("#select_1 option:selected").attr('value');
            $("#select_2").html(wait);
            $("#select_2").attr("disabled", "disabled");
            $("#select_3").html(choose);
            $("#select_3").attr("disabled", "disabled");

            $.post("select.php", {id_select_1:value_select_1}, function(data){
                $("select#select_2").removeAttr("disabled"); 
                $("select#select_2").html(data);

            });
        }); 

        $("#select_2").change(function(){
            $("#select_3").attr("disabled", "disabled");
            $("#select_3").html(wait);
            var val_select_2 = $("#select_2 option:selected").attr('value');
            $.post("select.php", {id_select_2:value_select_2}, function(data){
                $("#select_3").removeAttr("disabled");
                $("#select_3").html(data);
            });
        });

并选择样式https://github.com/patrickkunka/easydropdown

动态EasyDropDown.js选择

2 个答案: