<option>不附加<select>在jquery

Question

我试图通过解析来自XMl的数据，使用javascript在<select>附加<option> 。 从xml正确解析的数据，但它没有附加在<select> 。

另外，我想将选项显示为（图像+文本）格式。 这个怎么做....

我的HTML代码：

<form style="margin:20px 0">
    <p>
        <select id='mySelect' multiple="multiple" style="width:370px">
        </select>
    </p>

</form>

Javascript代码：

$(document).ready(function(){

    $.ajax({
        type: "GET",
        url: "newpersonal1.xml",
        dataType: "xml",
        success: function(xml) {
            var select = $('#mySelect');
            $(xml).find('value').each(function(){
                 var title = $(this).find('name').text();
                 alert(title);
                 select.append("<option value='"+title+"'>"+title+"</option>");         
            });                 
        }
    });
});

如何解决此问题并在select <option>添加图像。

Answer 1

以下代码对我有用。

$(function(){
   $.ajax({
    type: "GET",
    url: "newpersonal1.xml",
    dataType: "xml",
    success: function(xml) {
        var select = $('#mySelect');
        var options = '';
        $(xml).find('value').each(function(){
             var title = $(this).find('name').text();
             options += "<option value='" + title + "'>" + title + "</option>";                         
        });             
        select.html(options);
        $("#mySelect").multiselect().multiselectfilter();
    }
  });   
});

我注意到当从本地文件夹运行html时，xml文件不会加载到chrome中。 但它确实可以在服务器上运行。

如果有帮助，请标记为答案 干杯

Answer 2

当你以自己的方式处理“过滤和多选插件”时，你必须采取额外的步骤。

它模仿选择对象，隐藏原始对象并创建按钮和跨度元素集。 它仅在初始化时使用原始的。

因此，只要使用其他选项更新原始选择标记，就必须调用函数refresh（）。

http://www.erichynds.com/examples/jquery-ui-multiselect-widget/demos/#refresh

Answer 3

您的title字符串可能格式错误，需要转义。

除非您完全确定值不能包含任何特殊字符，否则连接字符串不是创建元素的好方法。 因此，更好的方法是：

$('<option>', { val: title, text: title }).appendTo(select);

我注意到，如果所需的值与选项中包含的文本相同，则实际上不必在<option>标记中指定值。

Answer 4

试试这可能对你有帮助，

   var selectList = "", title = ""; 
   $(xml).find('value').each(function(){ 
    title = $(this).find('name').text(); 
    selectList += "<option value='" + title + "'>" + title + "</option>";
   });
   $('#mySelect').html(selectList);  

这段代码是在我的情况下工作，不知道为你....

Answer 5

尝试

$( select ).append("<option value='"+title+"'>"+title+"</option>");

正如你所看到的，我正在用$（和）围绕“选择”