Question

为了保持岗位清洁，我缩小了一切。在我从页面中删除最后一个<li>元素后，我正在尝试向dom添加内容，该元素已通过jQuery附加。

我有一个.each函数，它使用JSON数组通过.append()填充无序列表。

var businessList = $('ul');
var businessInfo = [{"id": 10004, "category": "food"}]

$.each(businessInfo, function(idx, obj) {
        $(businessList).append('<li id="business-' + this.id + '">');
});

然后我有一个$.ajax调用，在检查提交的一些内容后删除每个<li>。通过使用.done或beforeSend:函数内的脚本。

一切正常，直到我尝试在删除最后一个<li>后添加要触发的函数。

让我说我想同时<button>到fadeIn()或在最后一个<li>元素消失后，我一直在尝试这样的事情：

$.ajax({
    type: "POST",
    url: "url",
    data: dataSource,
    dataType: "html",
    beforeSend: function() {
    //Invalid:
        if ($('li.class').is(':empty')) {
            xhr.abort();
        } 
    //Valid:
        else {
            $('li.class').remove();
        }

}).done(function() {
    $('document').ready(function() {
        if ($('li').length == 0) {
            $('.continue-btn').fadeIn(300);
            console.log('im the last one')
        }
    //Or this
    if ($('ul li:only-child')) {
            $('.continue-btn').fadeIn(300);
        }
    });
})

我只是不能只为页面上的最后一个<li>启动它。在beforeSend:内使用相同的内容会导致行为略有不同。（我的脚本会相应地触发，但是在第一次提交时，而不是最后一次提交）

我怀疑它是因为它已被附加，并且实际上并不存在，但是我再称之为其他功能。很困惑。

======================== 编辑：

正如Rens在下面提到的，它归结为使用success:函数。如果有人感兴趣，那就是工作示例：https://jsfiddle.net/aquillium/qnj15g3r/

Answer 1

我会尝试这个，看看控制台给你的是什么：

jQuery(document).ready(function($){

    var $doc = $(document);

    $doc.on('click', '.any-element', function(){
        console.log('execute ajax call');
        $('li.class').remove();
        var ajaxurl = 'escreen.php',
        $.ajax({
            url: ajaxurl,
            type: 'post',
            data: {
                buttons: $values,
            },
            success: function (result) {
                console.log('Yay it worked');
                if($('li').length==0){
                    $('.continue-btn').fadeIn(300);
                }
            },
            error: function (xhr, ajaxOptions, thrownError) {
                console.log('Something went wrong');
            }
        });
    });
});

我可以根据附加的<li>元素列表触发函数吗？

1 个答案: