按钮-仅当JavaScript函数返回true时才执行回发

我在ASP.NET中有一个按钮。当用户单击按钮时，我希望事先进行一些验证，因此只有当验证方法返回true时才会发生回发

我的想法是使用OnClientClick按钮的逻辑。如果您说OnClientClick=“return false；”，它将不会回发，而返回true将返回。但是，这不起作用，因为结果是，即使jQuery方法返回的结果是，它也不会进行回发

目前我有：

标记：

<asp:Button runat="server" ID="ReplyBtn" OnClientClick="return ValidateInput();" OnClick="ReplyBtn_Click" CssClass="btn-large btn-success"
    Text="Answer" />

JavaScript:

function ValidateInput() {
        var value = stripHtml(CKEDITOR.instances['ReplyBox'].getData()).trim();
        var options = {
            type: "POST",
            url: "../../Services/ForumOperationService.svc/ReplyToPostFeedback",
            data: '{"content":"' + value + '"}',
            async: false,
            contentType: "application/json; charset=utf-8",
            dataType: "json",
            success: function(msg) {
                $("#StatusReplyLbl").text(msg.ReplyToPostFeedbackResult);

                if (msg.ReplyToPostFeedbackResult) {
                    return false;
                } else {
                    return true;
                }

            },
            error: function () {
                return true;
            }
        };
        $.ajax(options);
        return false;
    }

    function stripHtml(str) {
        return $('<div />', { html: str }).text();
    }

函数ValidateInput（）{
var value=stripHtml（CKEDITOR.instances['ReplyBox'].getData（））.trim（）；
变量选项={
类型：“POST”，
url:“../../Services/ForumOperationService.svc/ReplyToPostFeedback”，
数据：“{”内容“'+value+“}”，
async:false，
contentType:“应用程序/json；字符集=utf-8”，
数据类型：“json”，
成功：功能（msg）{
$（“#StatusReplyLbl”）.text（msg.ReplyToPostFeedbackResult）；
if（消息ReplyToPostFeedbackResult）{
返回false；
}否则{
返回true；
}
},
错误：函数（）{
返回true；
}
};
$.ajax（选项）；
返回false；
}
函数stripHtml（str）{
返回$（''，{html:str}）.text（）；
}

---

那么基本上，这个代码有什么问题？在回发之前，如何对按钮执行验证？

您的函数无条件返回

false

，因为您没有使用来自ajax对象的响应。例如，假设您的服务器端脚本在验证成功时返回文本“OK”。您可以尝试以下方法：

function ValidateInput() {
    var value = stripHtml(CKEDITOR.instances['ReplyBox'].getData()).trim();
    var options = {
        type: "POST",
        url: "../../Services/ForumOperationService.svc/ReplyToPostFeedback",
        data: '{"content":"' + value + '"}',
        async: false,
        contentType: "application/json; charset=utf-8",
        dataType: "json",
        success: function(msg) {
            $("#StatusReplyLbl").text(msg.ReplyToPostFeedbackResult);
        }
    };
    var resp = $.ajax(options);
    return (resp.status==200 && resp.responseText == "OK");
}

---

理想情况下，您要做的是无条件返回false，并在成功处理程序中自己触发回发。

您的函数无条件返回

false

，因为您没有使用来自ajax对象的响应。例如，假设您的服务器端脚本在验证成功时返回文本“OK”。您可以尝试以下方法：

function ValidateInput() {
    var value = stripHtml(CKEDITOR.instances['ReplyBox'].getData()).trim();
    var options = {
        type: "POST",
        url: "../../Services/ForumOperationService.svc/ReplyToPostFeedback",
        data: '{"content":"' + value + '"}',
        async: false,
        contentType: "application/json; charset=utf-8",
        dataType: "json",
        success: function(msg) {
            $("#StatusReplyLbl").text(msg.ReplyToPostFeedbackResult);
        }
    };
    var resp = $.ajax(options);
    return (resp.status==200 && resp.responseText == "OK");
}

---

理想情况下，您要做的是无条件地返回false，并在成功处理程序中自己触发回发。

不是100%符合您的要求，但我相信问题是，即使您希望函数从ajax请求返回true，函数也总是返回false

如上所述，运行async的ajax将导致此功能无法工作，但看起来您将async设置为false

问题是你的回报

返回true；在ajax函数内部，返回的是ajax调用的success函数，而不是整个函数

我不认为这是实现目标的最佳方式，但根据您已有的代码，我认为您需要以下内容

function ValidateInput() {
    var replayToPost = false;
    var value = stripHtml(CKEDITOR.instances['ReplyBox'].getData()).trim();
    var options = {
        type: "POST",
        url: "../../Services/ForumOperationService.svc/ReplyToPostFeedback",
        data: '{"content":"' + value + '"}',
        async: false,
        contentType: "application/json; charset=utf-8",
        dataType: "json",
        success: function(msg) {
            $("#StatusReplyLbl").text(msg.ReplyToPostFeedbackResult);

            if (msg.ReplyToPostFeedbackResult) {
                replayToPost = false;
            } else {
                replayToPost = true;
            }

        },
        error: function () {
            return true;
        }
    };
    $.ajax(options);
    return replyToPost;
}

---

不是100%符合您的要求，但我相信问题在于函数总是返回false，即使您希望它从ajax请求返回true

如上所述，运行async的ajax将导致此功能无法工作，但看起来您将async设置为false

问题是你的回报

返回true；在ajax函数内部，返回的是ajax调用的success函数，而不是整个函数

我不认为这是实现目标的最佳方式，但根据您已有的代码，我认为您需要以下内容

function ValidateInput() {
    var replayToPost = false;
    var value = stripHtml(CKEDITOR.instances['ReplyBox'].getData()).trim();
    var options = {
        type: "POST",
        url: "../../Services/ForumOperationService.svc/ReplyToPostFeedback",
        data: '{"content":"' + value + '"}',
        async: false,
        contentType: "application/json; charset=utf-8",
        dataType: "json",
        success: function(msg) {
            $("#StatusReplyLbl").text(msg.ReplyToPostFeedbackResult);

            if (msg.ReplyToPostFeedbackResult) {
                replayToPost = false;
            } else {
                replayToPost = true;
            }

        },
        error: function () {
            return true;
        }
    };
    $.ajax(options);
    return replyToPost;
}

---

ajax函数中的返回结果将是success或error方法的返回，因此它将不支持ValidateInput（）方法。您需要在ajax调用范围之外声明一个变量，然后返回该结果

function ValidateInput() {
    var value = stripHtml(CKEDITOR.instances['ReplyBox'].getData()).trim();
    var result = false;

    $.post("../../Services/ForumOperationService.svc/ReplyToPostFeedback", '{"content":"' + value + '"}', function (msg) {
            $("#StatusReplyLbl").text(msg.ReplyToPostFeedbackResult);
            if (!msg.ReplyToPostFeedbackResult){
                result = true;
            }
    });

    return result;
}

---

ajax函数中的返回结果将是success或error方法的返回，因此它将不支持ValidateInput（）方法。您需要在ajax调用范围之外声明一个变量，然后返回该结果

function ValidateInput() {
    var value = stripHtml(CKEDITOR.instances['ReplyBox'].getData()).trim();
    var result = false;

    $.post("../../Services/ForumOperationService.svc/ReplyToPostFeedback", '{"content":"' + value + '"}', function (msg) {
            $("#StatusReplyLbl").text(msg.ReplyToPostFeedbackResult);
            if (!msg.ReplyToPostFeedbackResult){
                result = true;
            }
    });

    return result;
}

---

谢谢-该解决方案有效，短期内也会有效…-）我们将明确地考虑触发回发。再次感谢。谢谢-该解决方案有效，短期内也会有效…-）我们将明确地考虑触发回发。再次感谢。