Question

我正在使用C＃（它的网站不是Windows应用程序）在ASP.NET中开发一个简单的聊天系统。我正在显示一个包含TextBox的聊天窗口，以便用户可以在其中写入他/她的消息。我想要的是当用户按下ENTER键然后我将能够捕获ENTER按下的事件并且可以调用将在.cs文件中的函数。我怎样才能做到这一点？这是我项目的代码段：

    <!-- Some code here -->

    <asp:textbox TextMode="Multiline"
    Columns="28"
    id="Textbox1"
    Rows="5"
    runat="server"
    BorderStyle="Solid"
    BorderColor="Bisque"
    class="msg-area">
    </asp:textbox>

</asp:Panel>

谢谢。

Answer 1

由于它是一个多行文本框，您必须处理其中一个按键事件并让它回发表单，以便您可以在服务器上处理它。您也可以进行回调或ajax调用，但无论哪种方式，您都需要让javascript事件处理程序启动对服务器的调用，以便您的c＃代码可以运行。我需要更详细的了解您尝试做什么以及您使用什么来提供更详细的答案。

Answer 2

我认为使用AJAX在客户端做这种事情是最好的方法。在javascript中，要捕获回车键，请使用ascii值13.如果用户按下该键，则收集数据并进行ajax调用。在服务器端使用WebMethod来处理调用。使用jQuery，通过它的类而不是ID来引用你的文本框... ID不起作用，因为asp.net在呈现页面时将它自己的标识符添加到id。因此，要从文本框中获取值，请执行

var msgValue = $(".msg-area").val()

要在服务器端调用您的函数，请执行以下操作：

$.ajax({
    type: "POST",
    url: "yourwebpage.aspx/PostChat,
    contentType: "application/json; charset=utf-8",
    processData: false,
    global: false,
    success: function (data) {
        ajaxData = data;
        ajaxResult = true;
    },
    error: function (xhr, ajaxOptions, thrownError) {
        ajaxResult = false;
    }
});

最后，在服务器端，添加如下函数：

    [System.Web.Services.WebMethod]
    public static void PostChat()
    {
         /* post chat code here */
    }

这里遗漏了一些细节（比如在PostChat（）方法中，你想要将一些数据传递给PostChat（SomeObjectContainingChatData）作为JSON对象并反序列化，但这给你一般的想法！

Answer 3

通过jQuery快速实现捕获文本框：

$.fn.captureEnter = function(options) {
// Parameters = OBJECT {action, preventDefault}
// action - Javascript function to be called upon the enter keypress. Send NULL to perform NO ACTION
// preventDefault - Set to FALSE if you don't want to return FALSE
var defaults = {
    action: function() {
        alert('The enter button has been captured. Please provide a function to run on enter.');
    },
    preventDefault: true
};
options = $.extend(defaults, options);

return this.each(function() {
    var el = this;
    $(el).keypress(function(e) {
        var code = e.keyCode || e.which;
        if (code == 13) { //Enter keycode
            if ((typeof options.action) == "function") {
                options.action(el);
            }

            if (options.preventDefault) {
                e.preventDefault();
            }

        }
    });
});

};

$('TEXTBOX').captureEnter({
    action: postMessageAjaxFunction
});

如何捕获在TextBox中按下的ENTER键？

3 个答案: