struts2实现不刷新页面执行action

最新推荐文章于 2022-03-11 12:07:06 发布

dongchangzhang

最新推荐文章于 2022-03-11 12:07:06 发布

阅读量4.8k

点赞数

CC 4.0 BY-SA版权

分类专栏： java 文章标签： struts ajax 表单不刷新 jsp

本文链接：https://blog.youkuaiyun.com/dongchangzhang/article/details/53014321

java 专栏收录该内容

7 篇文章

订阅专栏

本文介绍了如何在JSP中利用AJAX实现不刷新页面执行Struts2的Action。通过示例代码展示如何在前端发送请求、处理响应，以及后台接收参数并返回结果的配置方法。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

前言

在jsp中有一些动作的执行不适合刷新页面来执行，比如点赞。一般在jsp中可以利用ajax实现这个功能，下面是一个不刷新页面来提交表单，数据或者单纯执行action的例子。

开始

首先在jsp中加入代码，在需要触发action的部分写入如下代码：

<input id="name" type="text">
<input type="button" value="ok" onclick="javascript:clickButton();" clientidmode="Static">

这个动作将id为name的数据传入后台，clientidmode=”Static”这个选项可以防止更改文本框内容后仍然提交以前的内容。这个action触发的js代码如下

<script type="text/javascript">
    function clickButton()
    {    
        var url = 'ajaxRequest.action';
        var params = {
        name:eval(document.getElementById('name')).value
    };
    jQuery.post(url, params, callbackFun, 'json');
    }
    function callbackFun(data)
    {
        alert(data.result);
    }
</script>

在上述代码中的函数由上面的button触发，其中var url是你的触发的动作名称+.action，这个动作名称在struts.xml中设定。var params中是要传递的参数， name:eval(document.getElementById(‘name’)).value是获取id为name的内容并且赋值给变量name，jQuery.post(url, params, callbackFun, ‘json’);则是将数据post传递到后台，其中当参数返回时会调用callbackFun这个函数显示返回的result这个变量，这个可以直接使用java中的getter获得。

后台的函数如下：

package com.teamghz.action;


public class AjaxExampleAction {

    private String name;
    private String result;
    // ajax请求参数赋值
    public void setName(String name) {
        this.name = name;
    }
    // ajax返回结果
    public String getResult() {
        return result;
    }
    public String execute() {
        this.result = "Hello! " + this.name + ".";
        System.out.println("hereh" + this.name);
        return "success";
    }
}

这个函数获得前端传入的name并且将其赋值给result，前段根据getter方法或者这个数据

strtus.xml配置如下

<package name="ajax" extends="json-default">
        <action name="ajaxRequest"
            class="com.teamghz.action.AjaxExampleAction">
            <result type="json"></result>
       </action>
</package>

这样就可以完成不刷新页面调用action的功能了。