Jquery SpringMVC将AJAX调用返回的数据显示在同一网页上，而不是单独的网页上

我正在尝试使用SpringBoot和ajax来玩简单的web应用程序。 我的想法是，当我提交Http POST表单数据时，我希望通过AJAX调用调用控制器，并在同一网页上显示结果

当我运行sprint启动应用程序时，它会在上选择正确的页面index.html

目前我可以调用ajax，但问题是页面正在转发到显示器

“来自Spring Boot的问候！@myemail”

，但我希望它显示这一点，并保持在同一页中，仅从控制器返回数据

我肯定错过了一些根本错误的东西。下面是我的代码片段

index.html:

<form id="signup-form" method=post action="/test">
<input type="email" name="email" id="email" placeholder="Email Address"/><input type="submit" value="Sign Up" />
</form>

$form.addEventListener('submit', function(event) {

                    var data = 'dmc='+ encodeURIComponent(dmc.value);
                        $.ajax({
                            url:"test",
                            data : data,
                            type : "POST",

                            success : function(response) {
                                alert( response );
                                $message._show('success', response);
                            },
                            error : function(xhr, status, error) {
                                alert(xhr.responseText);
                        },
                            complete: function() {
                                window.location = 'index.html';
                              }

                        });
                        return false;

                });

@RequestMapping(value="/test",method=RequestMethod.POST)
    public String index(@RequestParam(value="email", required=false) String email) {
        return "Greetings from Spring Boot! "+email+";
    }

休息控制器：

<form id="signup-form" method=post action="/test">
<input type="email" name="email" id="email" placeholder="Email Address"/><input type="submit" value="Sign Up" />
</form>

$form.addEventListener('submit', function(event) {

                    var data = 'dmc='+ encodeURIComponent(dmc.value);
                        $.ajax({
                            url:"test",
                            data : data,
                            type : "POST",

                            success : function(response) {
                                alert( response );
                                $message._show('success', response);
                            },
                            error : function(xhr, status, error) {
                                alert(xhr.responseText);
                        },
                            complete: function() {
                                window.location = 'index.html';
                              }

                        });
                        return false;

                });

@RequestMapping(value="/test",method=RequestMethod.POST)
    public String index(@RequestParam(value="email", required=false) String email) {
        return "Greetings from Spring Boot! "+email+";
    }

---

查看现有问题：

尝试从按钮中删除'type=“submit”'属性，并为按钮提供id

<input id="buttonId" value="Sign Up" />

---

您不需要在js函数中返回false。您的控制器看起来很好。

检查现有问题：

尝试从按钮中删除'type=“submit”'属性，并为按钮提供id

<input id="buttonId" value="Sign Up" />

---

您不需要在js函数中返回false。您的控制器看起来不错。

我会使用ResponseBody：

@RequestMapping(value="/test",method=RequestMethod.POST)
public @ResponseBody String index(@RequestParam(value="email", required=false) String email)

然后：

success : function(response) {
    $message._show('success', response);
 },

---

我会使用ResponseBody：

@RequestMapping(value="/test",method=RequestMethod.POST)
public @ResponseBody String index(@RequestParam(value="email", required=false) String email)

然后：

success : function(response) {
    $message._show('success', response);
 },

---

我没有使用ResponseBook，因为我在我的类上使用的是Annotation RestController，您不需要在其中声明。您的成功、完整和错误方法现在在做什么？有输出吗？您说过希望保持在同一页上，但您正在更改位置：window.location='index.html'；我没有使用ResponseBook，因为我在我的类上使用的是Annotation RestController，您不需要在其中声明。您的成功、完整和错误方法现在在做什么？有输出吗？您说过希望保持在同一页上，但您正在更改位置：window.location='index.html'；