Question

我希望点击链接显示提醒框后选择ok和cancel，如果用户点击按钮ok，则返回功能为true，如果点击按钮cancel返回它的功能是false，问题在于点击链接后总是返回true。怎么解决它？

function myalert() {
    var result = true;
    var $alertDiv = $('<div class="alert">Do you want to delete this item?<button class="ok">ok</button><button class="cancel">cancel</button></div>');
    $('body').append($alertDiv);
    $('.ok').click(function () {
        $('.alert').fadeOut(100);
        $('#appriseOverlay').css('display', 'none');
        result = true;
    });
    $('.cancel').click(function () {
        $('.alert').fadeOut(100);
        $('#appriseOverlay').css('display', 'none');
        result = false;
    });
    $alertDiv.fadeIn(100);
    $('#appriseOverlay').css('display', 'block');
    return result;
};

$('.iu').click(function () {
    alert(myalert());
    if (myalert() == true) {
        alert('ok')
    } else {
        alert('no')
    }
});

更新

...
$('.iu').click(myalert)
function callback(result) {
    //
    if(result){
        alert(result);
        $('.image_upbg').each(function(){$(this).removeClass().addClass(unique())});
        var get_class = '.'+$(this).closest('div').attr('class');
        var get_val = $(this).closest('a').find('input').attr('value');
        //alert(get_val);
        var val = 'val_upimg1=' + get_val;
        $(get_class).fadeOut('slow');
          $.ajax({
                type: "POST",
                dataType: 'json',
                url: 'delete_upimg',
                data: val,
                cache: false,
                success: function (data) {
                        $(get_class).fadeOut('slow');
                },
                "error": function (x, y, z) {
                    // callback to run if an error occurs
                    alert("An error has occured:\n" + x + "\n" + y + "\n" + z);
                }
       });
    }else{
        alert('no')
    }
}

Answer 1

如果你想保持这样的结构，你可以在用户回复后使用回调。

http://jsfiddle.net/MaGyp/2/

function myalert() {
  ...do stuff here
        $('.ok').click(function () {
            callback(true);     // callback when user clicks ok
        });
        $('.cancel').click(function () {
            callback(false);    // callback when user clicks cancel
        });
}

$('.iu').click(myalert);

function callback(result) {
    alert(result);
}

根据Ben的建议，您可以通过将回调函数作为第一个函数的参数来消除紧耦合来改进这一点。

Answer 2

myalert()在result设置为true或false之前返回。要解决此问题，我建议让myalert()将回调函数作为参数，并在click()内的myalert()处理程序中调用它。然后需要将.iu事件处理程序拆分为两个函数，其中一个函数是传递给myalert()的回调函数。

Answer 3

你不是在等待ok和取消点击所以总是会返回true。

修改小提琴 - http://jsfiddle.net/MaGyp/3/

function myalert() {
    var result = true;
        //var hide = $('.alert').fadeOut(100);
        //var css = $('#appriseOverlay').css('display','none');
        var $alertDiv = $('<div class="alert">Do you want to delete this item?<button class="ok">ok</button><button class="cancel">cancel</button></div>');
        $('body').append($alertDiv);

        $alertDiv.fadeIn(100);
        $('#appriseOverlay').css('display','block');
        return result;
    };

$(document).ready(function(){
    $('.ok').live('click',function () {
        $('.alert').fadeOut(100);
        $('#appriseOverlay').css('display','none');
        alert('ok');
    });

    $('.cancel').live('click',function () {
        $('.alert').fadeOut(100);
        $('#appriseOverlay').css('display','none');
        alert('cancel');
    });

    $('.iu').click(function() {
        myalert();
    });
})

我的功能不正常吗？

3 个答案: