Question

我尝试通过解析来自XMl的数据，使用javascript在<option>内附加<select>。正确地从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>");         
            });                 
        }
    });
});

如何解决此问题并在选择<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>");

正如您所看到的，我正在使用$（和）

围绕“选择”

<option>不会附加在jquery </select> </option>中的<select>中

5 个答案: