c# - 为什么jquery多选控件在动态填充时会停止正常工作？

Question

我有这个代码：

<select id="sState" multiple="multiple" name="sState" size="5"> 
<option value="option1">Option 1</option> 
<option value="option2">Option 2</option> 
<option value="option3">Option 3</option> 
<option value="option4">Option 4</option> 
<option value="option5">Option 5</option> 
<option value="option6">Option 6</option> 
<option value="option11">Option 11</option> 
<option value="option12">Option 12</option> 
</select> 

完美运行，CSS 看起来符合预期。

但是，当我想动态填充它时，我必须添加 runat="server" 。然后第一行必须更改为：

<select id="sState" runat="server" meta:multiple="multiple" name="sState" size="5"> 

一旦我这样做，它就会失去所有的 CSS 格式，看起来像一个列表框。

知道为什么会这样吗？

Answer 1

出现此问题的原因是多选小部件在部分回发时将自身附加到正文。尝试从 DOM 中删除菜单，然后像这样再次初始化：

<script>
    var pageRequest = Sys.WebForms.PageRequestManager.getInstance();

    pageRequest.add_endRequest(function () {
        $('.ui-multiselect-menu').each(function() {
            $(this).remove();
        });
        $('#sState').multiselect({
            multiple: false,
            header: false,
            noneSelectedText: false,
            selectedList: 1,
            minWidth: 170
        });
    });

</script>