0

ユーザーがドロップダウンから選択した状態に応じてストアをフェッチしようとしています。

<select name="addressInput" id="state" class="mx-stateSelect" onchange='getRetailers()'>
    <option value=""> Choose State</option>
    <option value="Alberta"> Alberta Canada</option>
    <option value="Alaska"> Alaska </option>
    <option value="Alabama">Alabama</option>
    ...
    <option value="Washington"> Washington </option>
</select>

jQuery関数

function getRetailers() {
    var state = $('#state').val();
    var searchUrl = 'getRetailers.php?state=' + state;

    $.getJSON(searchUrl, function(data) {
        var items = [];

        $.each(data, function(key, val) {
            items.push('<li id="' + val.id + '"><a href="#" data-lat="' + val.lat + '" data-lng="' + val.lng + '">' + val.name + '<br/>' + val.address + ', ' + val.city + ', ' + val.zipcode + ' ' + val.stab + '</a></li>');
        });


        $('<ul/>', {
            'class' : 'mx-retailers',
            html : items.join('')
        }).appendTo('.mx-retailerResult');
    });
}

これは、コードにULLIの別のセットを追加しています。古いLIを新しいLIに置き換えたいので、データベースからフェッチします。

HTMLコード

<div class="mx-retailerResult">
    <ul class="mx-retailers">
    </ul>
</div>

UL内のすべてのLI要素を削除し、データベースの新しいコンテンツに置き換えたい

4

3 に答える 3

1 
$('<ul/>', {
    'class' : 'mx-retailers',
    html : items.join('')
}).appendTo('.mx-retailerResult');

上記のコードは新しいul要素を作成しますtry

$('ul.mx-retailers').html(items.join(''));
于 2012-05-28T08:16:55.260 に答える
1

このコードブロックは、次のクラスを持つ新しいUL要素を作成していますmx-retailers。

$('<ul/>', {
            'class' : 'mx-retailers',
            html : items.join('')
        }).appendTo('.mx-retailerResult');

これを行いたくない場合は、次のように置き換えてください。

items.join('').appendTo('.mx-retailerResult');

これにより、すべてのli要素が次のクラスのulに追加されます。mx-retailerResult

于 2012-05-28T08:08:42.977 に答える
1 
$('.mx-retailerResult').html($('<ul/>', {
    'class' : 'mx-retailers',
    html : items.join('')
}));
于 2012-05-28T08:28:11.843 に答える