Question

function showMember() {
    $.ajax({
        type: 'get',
        url: '<?php echo $this->createUrl('member'); ?>',
        data: {
            index: $('#members fieldset').length
        },
        cache: false,
        dataType: 'html',
        success: function (html) {
            $('#members').append(html);
        }
    });
}

$(function () {
    showMember();
    $('.addMember').on('click', function () {
        showMember();
        //length+1 ???
        if ($('#members fieldset').length + 1 > 2) {
            $(this).hide();
        }
    });
});

为什么$('#members fieldset').length在点击时调用showMember();时没有考虑添加的字段集？

有没有办法让$('#members fieldset').length知道这一点，以避免添加+1？

感谢。

更新：以下是基于以下答案的新代码：

$(function() {
   showMember();
   $('.addMember').on('click', function() {
        showMember().done(function() {
            alert('hi there');
            if($('#members fieldset').length > 2) {
              $(this).hide();
            }
        });
   });    
});

似乎未在.done(function上输入，否 alert()已显示。

再次感谢。

Answer 1

您需要确保在AJAX请求完成后运行代码。最简单的方法是返回promise对象并为成功事件附加另一个处理程序：

function showMember() {
    return $.ajax({
        type: 'get',
        url: '<?php echo $this->createUrl('
        member '); ?>',
        data: {
            index: $('#members fieldset').length
        },
        cache: false,
        dataType: 'html',
        success: function(html) {
            $('#members').append(html);
        }
    });
}

$(function() {
    showMember();
    $('.addMember').on('click', function() {
        showMember().done(function() {}
        if($('#members fieldset').length + 1 > 2) {
            $(this).hide();
        });
    });
});

好消息是done()回调也会收到与success相同的参数，因此如有必要，您也可以在那里访问响应。

Answer 2

因为你的if语句不会等到你的ajax完成。可能在添加html之前执行计数。您可以将if函数放在setTimeout中，或者在附加html之后在ajax回调中运行代码。

Answer 3

其他答案打败了我，但这只是提供另一种选择

function showMember() {

    var THIS = this; // <------ note this

    $.ajax({
        type: 'get',
        url: '<?php echo $this->createUrl('member'); ?>',
        data: {
            index: $('#members fieldset').length
        },
        cache: false,
        dataType: 'html',
        success: function (html) {
            $('#members').append(html);
            if ($('#members fieldset').length + 1 > 2) {
                $(THIS).hide();
            }
        }
    });
}

$(function () {
    showMember();
    $('.addMember').on('click', function () {
        showMember.apply(this); // <--- and note this
    });
});

为什么$（'something'）。长度不会在此代码段上更新？

3 个答案: