Java 如何使用ajax在同一页面中显示结果？

当我按下submit按钮时，它将使用ajax和jquery在同一calculationFrom.jsp中显示包含加法、减法、乘法和除法的结果

我用来获取响应的jquery和ajax是

    Here is my calculatioform.jsp which accept two number.

---

但是这个代码不起作用。我需要做什么才能使代码正常工作。

您没有在成功回调函数定义中定义

数据

                String result = "({";
                result += " val1 : " + val1 + ",";
                result += " val2 : " + val2 + ",";
                result += " sum : " + (val1 + val2) + ",";

根据返回的数据，您可能需要使用
dataType
选项指定返回类型

        $.ajax({  
            type: "GET",  
            url: "calculator.jsp",  
            data: str,  
            cache:false,
            success: function(data) {  //you need data defined 

附加编辑

另外，您似乎将单击事件附加到了提交按钮，这可能会导致脚本提交到自身或您在
操作
属性中设置的任何页面，您需要让它使用
预防默认
取消默认操作

        $.ajax({  
            type: "GET",  
            url: "calculator.jsp",  
            data: str,  
            cache:false,
            dataType:"json",
            success: function(data) {
               //access properties through data
               var msg = data.val1 + " + " + data.val2 + " = " + data.sum + '\n';

您也可能会遇到解析错误，您还可以设置错误回调

$(".button").click(function(e) { //e will hold the event object
           e.preventDefault() //prevents the default action of the event, 
                              //in this case the form submission
           var str = $("form").serialize();

您可以通过web方法获得响应

$.ajax({  
    type: "GET",  
    url: "calculator.jsp",  
    data: str,  
    cache:false,
    dataType:"json",
    success: function(data) {  
       var msg = data.val1 + " + " + data.val2 + " = " + data.sum;
        alert(msg);
    },
    error:function(xhr,errormsg) {
       alert(errormsg);
    }  
}); 


$（文档）.ready（函数（）{
$（“#btn”）。单击（函数（）{
var marks1=$（“#marks1”）.val（）；
var marks2=$（“#marks2”）.val（）；
var option=$（“输入：radio:checked”）.val（）；
var str=$（“form”）.serialize（）；
$.ajax({
键入：“GET”，
url:'操作'，
数据：{marks1:marks1，
marks2:marks2，
选项：选项
},
成功：功能（数据）{
//做点什么
}
});
});
});
不工作意味着什么？出现错误或输出不令人满意还是什么？在成功回调中，数据未定义。。。请检查你的控制台@Java初学者否没有错误，但单击submit按钮后不会发生任何事情。什么不起作用？您的javascript控制台中有任何错误吗？另外，当您使用
eval（data）
时，jquery可以自动解析json、xml、html等数据，因此您可能不需要evalNo我没有收到任何错误。但是当我按下submit按钮时，页面中没有任何更改。您也没有阻止表单提交的默认操作，在提交页面时，它将导致ajax请求在页面更改时停止，请参阅最新编辑，但在ajax调用后，我添加了返回false。我想它也会做同样的事情，没有看到返回错误，但是如果在返回错误之前出现错误，那么表单将被提交，并且您将不会在控制台中看到任何错误，因为您将基本上处于一个新页面上。根据您使用的浏览器，您可以告诉javascript控制台在导航时保留控制台消息。我怀疑您的脚本在某个地方出错，但在表单提交和更改页面时，您没有收到错误。尝试设置控制台以保留控制台消息。
$.ajax({  
    type: "GET",  
    url: "calculator.jsp",  
    data: str,  
    cache:false,
    dataType:"json",
    success: function(data) {  
       var msg = data.val1 + " + " + data.val2 + " = " + data.sum;
        alert(msg);
    },
    error:function(xhr,errormsg) {
       alert(errormsg);
    }  
}); 

 $(function(){ 
       $(".button").click(function() {  
          var str = $("form").serialize();
          $.ajax({  
               type: "GET",  
               url: "calculator.jsp",  
               data: str,  
               cache:false,
               success: function(response) {  
              }
         });
    });

<script type="text/javascript">
            $(document).ready(function(){
                $("#btn").click(function(){
                    var marks1=$("#marks1").val();
                    var marks2=$("#marks2").val();
                    var option=$("input:radio:checked").val();
                    var str = $("form").serialize();
                    $.ajax({
                        type: 'GET',
                        url: 'Operation',
                        data:{  marks1:marks1,
                            marks2:marks2,
                            option:option
                        },
                        success: function(data){
                           //Do something
                        }
                    });
                });
            });