logo标签列表

Jsp使用jQuery进行ajax调用

jquery-uijqueryjquery-plugins
10

我有这段代码片段，其中我正在将数据传递到另一个JSP文件。

Javascript

$(document).ready(function() {
    $("#click").click(function() {
        name = $("#name").val();
        age = $("#age").val();
        $.ajax({
            type : "POST",
            url : "pageTwo.jsp",
            data : "name=" + name + "&age=" + age,
            success : function(data) {
                $("#response").html(data);
            }
        });
    });     
});
HTML
<body>
    Name:<input type="text" id="name" name="name">
    <br /><br /> 
    Age :<input type="text" id="age" name="age">
    <br /><br />
    <button id="click">Click Me</button>
    <div id="response"></div>
</body>

在 pageTwo.jsp 中，我的代码是

 <%
   String name = request.getParameter("name");
   String age = request.getParameter("age");
   out.println(name + age);
 %>

但这并没有起作用。我的 JQuery 有错误吗？能否请任何人帮忙？

2个回答
4
$("#click").click(function(e) {
    // e.preventDefault();
    ...
    return false;
});

当然，您需要安装Firebug或使用Chrome默认的开发者工具（F12），并打开控制台运行代码。

为什么需要“return false;”？它可以工作，但我不明白为什么。 - Gabrer
1
“return false”可以停止任何默认操作。比如说，“#click”是一个链接，当你点击它时，它会重定向到某个页面（href url），如果你有“return false”，它就不会执行浏览器的默认操作。“return false”需要放在回调函数内部代码的末尾。你也可以使用“e.preventDefault();”，将其放在回调函数内部代码的顶部。 - HamidRaza
1
$(document).ready(function () {
    $("#click").click(function () {
        name = $("#name").val();
        age = $("#age").val();
        $.ajax({
            type: "POST",
            url: "pageTwo.jsp",
            data: "{'name':'" + name + "','age':'" + age + "'}",
            contentType: "application/json",
            async: false,
            success: function (data) {
                $("#response").html(data.d);
            }
        });
    });
});
网页内容由stack overflow 提供, 点击上面的
可以查看英文原文，
原文链接