选择元素仅显示第一个字符答案

【问题标题】：select element shows first char only选择元素仅显示第一个字符
【发布时间】：2012-08-17 01:43:06
【问题描述】：

我有一个在 ajax 调用中填充了 jquery 的 select html 元素。一切似乎都可以正常工作，但在 IE9 中，选择框只显示文本的第一个字符。

这是重现行为的 de jsfiddle：

http://jsfiddle.net/PjDfS/

我知道在这里<select> only shows first char of selected option 也提出了同样的问题，但该解决方案不适用于我的情况。 (http://jsfiddle.net/PjDfS/2/)

任何帮助将不胜感激。

【问题讨论】：

标签： jquery html internet-explorer-9

【解决方案1】：

最后，工作代码：

http://jsfiddle.net/PjDfS/5/

我做了什么？最后我回到旧的帖子答案并稍微改变我的第一种方法。

为了更清楚，将原来的选择保留为'display：none'，最后删除该属性。

【讨论】：

...这是我接受的答案，但我现在无法确认，我需要等待两天

【解决方案2】：

我不知道为什么，但这种方式似乎可行：

http://jsfiddle.net/PjDfS/4/

另外，我不确定代码是否完全等效。无论如何它到目前为止都有效......

【讨论】：

好的，尝试在我的“真实世界”应用程序中实现这种方法后，事实证明，如果您实际使用 AJAX 调用返回的数据，它将无法正常工作（这意味着 IE9 将继续只显示第一个字符）......但好的部分是经过大量的脏话和坏话，我设法让它发挥作用。查看我接受的答案...

【解决方案3】：

尝试在标记中的select 中添加一个option，然后使用脚本将其删除。

看起来这样一个选项的文本以某种方式“分配”了水平空间，并且您将无法获得不再正确显示的 ajax 填充文本..

更新：刚刚尝试过，但它更复杂.. 仅在您保留原始选项之前有效:(

【讨论】：

我很遗憾听到它不起作用......真的这是一个很奇怪的行为

【解决方案4】：

我认为IE9的问题在于

var messageFieldInput = $('#MessageFieldInputTemplate > .messageField-input').clone()

这里：

var testObj = [];
testObj[0] = {
    text: 'description 1',
    value: 'value 1'
};
testObj[1] = {
    text: 'description 2',
    value: 'value 2'
};

$.get('/echo/json', function (data) {
    var messageFieldInput = $('#MessageFieldInputTemplate > .messageField-input'); //no .clone()
    $('#MessageFieldContainer').append(messageFieldInput);
    messageFieldInput.find('.editor-label').text('Label');

    $.get('/echo/json', function (data) {
        var fieldSelect = messageFieldInput.find('.editor-field > select');            

        $.each(testObj , function (index, item) {
            fieldSelect.append(
                $('<option/>', {
                    'value':item.value,
                    'text':item.text
})
            );
        });
    });
});

【讨论】：

这是个好主意，但我需要添加多个选择元素，并且不克隆不可能的模板元素