Question

我使用以下代码为我的Web应用程序设置自动完成功能。在jsfiddle中一切正常，这里是链接http://jsfiddle.net/JhRL5/1/

 <select data-placeholder="Your Favorite Types of Bear" data-role="none" multiple class="chosen-select-width" tabindex="16" id="test">
        <option value="" disable></option>
        <option value="3">American Black Bear</option>
        <option value="4">Asiatic Black Bear</option>
        <option value="5">Brown Bear</option>
        <option value="6">Giant Panda</option>
        <option value="7">Sloth Bear</option>
        <option value="8">Sun Bear</option>
        <option value="9">Polar Bear</option>
        <option value="10">Spectacled Bear</option>
      </select>

的Javascript

 var config = {
      '.chosen-select-width'     : {width:"75%"}
    }
    for (var selector in config) {
      $(selector).chosen(config[selector]);
    }

$(document).ready(function(){

    $("#test").change(function(){
        var a = $("#test :selected").text();
        $("#selectedlist").html(a);
    });

    $("#s-all").click(function(){

        var a = $("#test option");

        $.each( a, function( i, val ) {
            $(val).change();
        });

        var b = $("#test option").text();
        $("#selectedlist").html(b);

    });

    $("#c-all").click(function(){

        $("#test option:selected").removeAttr("selected");

        var a = $("#test :selected").text();
        $("#selectedlist").html(a);
        $(".chosen-choices").find("li.search-choice").remove();

    });

});

CSS

#selectedlist { border: solid 1px #eee; margin-top:20px; padding:10px}
#selectedlist span{width: 100%; float: left;}

请参考jsfiddle链接，jsfiddle中的所有内容似乎都运行良好，但相同的代码在我的网站中无效。

请在http://20percents.tk/backend/extra-pages/test1/

查看我的网站链接

我尝试将CSS属性设置为select.not('test1')，但它仍无效。

感谢任何帮助。

Answer 1

将脚本放在不同位置后开始工作。必须是jquery冲突。

jQuery从选择框中自动完成多个值

1 个答案: