0

これは私のコードです:

<script language="JavaScript" type="text/javascript">
            (function($) {
            $(document).ready(function(){
                    var path = "http://shop.vodafone.co.uk",
                        phoneList = $('#phoneList');
                    $.getJSON("phones.json", function(data){
                            var option = $('option').attr('value', data);
                            var phones = [];
                            for(var phone in data) {
                                //phones.push("<option value='"+data[phone].value+"'>"+data[phone].name+"</option>");
                                phones.push(data[phone]);
                            }

                            //console.log(phones);
                            phones.sort(function(a, b){
                                var aName = a.name.toLowerCase(),
                                    bName = b.name.toLowerCase();
                                if(aName < bName) {
                                    return -1;    
                                }
                                if(aName > bName){
                                    return 1;
                                };
                                return 0;
                            });
                            var select = $('<option value="Take your pick"></option>').val();
                            var htmlElements = [];
                            for(var i = 0; i<phones.length; i++) {
                                htmlElements.push("<option value='"+phones[i].value+"'>"+phones[i].name+"</option>");
                            }
                            //htmlElements.before(select);
                            $("#phoneList").before(select).html(htmlElements.join('\n'));
                            //val = $(this).find('option:selected').val(),

                    });
                    $('.phoneSelect').bind('change', function(){
                        var url = $("#phoneList option:selected").val();
                        window.location = path + url;
                    });
            });
            })(jQuery);
    </script>

HTML は次のとおりです。

<div>
 <form class="phoneSelect" action="#">
 <select style="width: 200px" name="phoneMake" id="phoneList">
    <option selected="selected" value="Take your pick">Take your pick</option>
 </select>
</form>
</div>

問題は、動的に構築されたドロップダウンリストの前に上記の要素「Take your pick」を追加しようとしていて、すべて同じフォーム要素を使用していることです。ドロップダウン リストのデータは、JSON ファイルから取得されます。

誰かが私が間違っているところを教えてもらえますか?

4

1 に答える 1

0

ループ中に数字を追加してみてください：

for(var i=0; i<phones.length; i++){
    $("#phoneList").append($("<option value='"+phones[i].value+"'>"+phones[i].name+"</option>"));
}
于 2012-08-22T12:48:34.570 に答える