Я столкнулся с проблемой в диалоговом окне JQuery, в котором было написано, чтобы попросить пользователя ввести комментарий, но функция не работает должным образом из-за асинхронного AJAX.

Вот пример кода

HTML

    <header>
    <nav>
        <input type="button" id="to-execute" value="Execute"/>
        <input type="hidden" id="data1" value="1" />
        <input type="hidden" id="data2" value="2" />
    </nav>
</header>


<div id="add-comment" style="display:none;">
    <b>Please enter comment:</b>
    <textarea name="comment" rows="5" cols="50"></textarea>
</div>

Javascript

    $(document).ready(function() {
    $("input#to-execute").live("click", function() {
        if (calUtils.addCalculation() && calUtils.commentAdd()) {
            return calUtils.endResult();
        }
        alert("I not enter the function at all");
    });
});


var calUtils = {
    addCalculation: function() {
        var sum = parseInt($("#data1").val()) + parseInt($("#data2").val());
        if (sum > 0) {
            alert("More than Zero. Sum =" + sum);
            return true;
        } else {
            alert("Less than Zero. Sum =" + sum);
            return false;
        }
    },
    commentAdd: function() {
        // Dialog
        $("#add-comment").dialog({
            title: "Comment",
            modal: false,
            width: "500",
            resizable: false,
            position: "center",
            buttons: {
                "Cancel": function() {
                    $(this).dialog("close");
                    return false;
                },
                "Confirm": function() {
                    var comment = $("#add-comment textarea").val();
                    if (!comment && comment != null) {
                        alert("Please enter Comment!");
                        return false;
                    }
                    $(this).dialog("close");
                    return true;
                }
            }
        }).dialog("open");

    },
    endResult: function() {
        alert("Thanks you");
    }
}

При нажатии кнопки «Выполнить» функция не ждет завершения выполнения callUtils.commentAdd(), прежде чем перейти к следующей строке. Это приведет к тому, что callUtils.endResult() никогда не будет выполняться вечно.

Может ли кто-нибудь разумно сказать мне, что не так с моим кодом? Как я могу закодировать такую ​​программу, которая будет выполнять calUtils.endResult(), когда оба (calUtils.addCalculation() && calUtils.commentAdd()) == TRUE?

Вы можете попробовать код здесь http://jsfiddle.net/fsloke/4qdsx/1/

Спасибо -fsloke

0
fsloke 7 Апр 2011 в 06:40

1 ответ

Ваша функция «calUtils.commentAdd()» всегда будет возвращать неопределенное значение для текущего оператора, что означает, что calUtils.addCalculation() && calUtils.commentAdd() всегда будет ложным. Я думаю, именно поэтому ваш "calUtils.endResult()" никогда не работает.

0
tsinghua 7 Апр 2011 в 06:52
Из-за вызова ajax он стал неопределенным, как заставить это работать?
 – 
fsloke
15 Апр 2011 в 17:28