按钮点击.aspx时无法使用jQuery AJAX检索数据

时间:2013-11-08 00:03:51

标签: javascript

我有这个带有jQuery AJAX的.aspx网站。

当我没有按钮时,它可以正常工作。

当我用一个按钮包装AJAX时,它不起作用。没有错误,没有成功警报,没有AJAX请求,控制台中没有任何内容。它就停止了。我不知道为什么:(

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="WebForm1.aspx.cs" Inherits="WebApplication1.WebForm1" %>

<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>

    <script src="http://code.jquery.com/jquery-latest.min.js" type="text/javascript"></script>

    <script>
        $(document).ready(function () {
            $("#button1").click(function () {
                $.ajax({
                    url: 'WebForm1.aspx',
                    success: function (data) {
                        $('#comments').html(data);
                        console.log("success");
                    }
                });
            });
        });
    </script>

</head>
<body>
    <form id="form1" runat="server">
    <div>

        <button id="button1">get recent comments</button>

        <div id="comments" runat="server">

        </div>

    </div>
    </form>
</body>
</html>

1 个答案:

答案 0 :(得分:3)

默认情况下,该按钮将提交表单并发布。您希望在使用preventDefault()的jQuery中阻止此行为:

$("#button1").click(function (event) {
    event.preventDefault();

    ... etc ...
});

防止jQuery传递给你的函数的click事件的默认行为应该使它按预期运行。


http://api.jquery.com/event.preventDefault/