Question

我正在尝试根据用户从下拉列表中选择的状态来获取商店。

<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');
    });
}

这是在代码中添加另一组UL LI。我想用数据库中的新LI取代旧的LI。

HTML代码

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

我想删除UL中的所有LI元素，并将其替换为数据库中的Fresh内容

Answer 1

您拥有的这段代码正在创建一个类mx-retailers：

的新UL元素

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

如果您不想这样做，请将其替换为以下内容：

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

这会将所有li元素添加到具有mx-retailerResult

类的ul中

Answer 2

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

上面的代码创建了一个新的ul元素try

$('ul.mx-retailers').html(items.join(''));

Answer 3

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

jQuery在UL中删除LI元素

3 个答案: