a标签不跳转+ajax异步请求+局部刷新页面

最新推荐文章于 2025-06-27 16:13:39 发布

原创最新推荐文章于 2025-06-27 16:13:39 发布 · 6.7k 阅读

1 ·

CC 4.0 BY-SA版权

js 专栏收录该内容

1 篇文章

订阅专栏

本文探讨了如何使用a标签实现不跳转的点击事件，并通过Ajax进行局部页面刷新，改变工作台账显示状态。具体实现了点击a标签后，通过确认框询问用户是否改变状态，然后发送Ajax POST请求至服务器，根据响应结果更新页面内容。

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

a标签不跳转

<td style="text-align:center;">
    <a  href="" style="color: #2d78b8" id="tzzt_${i}" title="改变状态" onclick="changeTzzt('${data.id}','tzzt_${i}');return false">
        ${data.isTaiZhang==1?'是':'否'}
    </a>
</td>

ajax异步请求+局部刷新页面

//改变是否导出工作到台账的状态
function changeTzzt(workDataId,tdId){
    if(confirm("是否改变工作的台账显示导出状态？")){
        $.ajax({
            type:'POST',
            url:'${createLink([controller: 'krsWorkData',action: 'changeTzzt'])}',
            data:{"workDataId":workDataId},
            dataType:"json",
            global:false,
            success:function(json){
                if (json.statusCode==200) {
                    if(json.data=='1'){
                        document.getElementById(tdId).innerHTML="是";
                    }else{
                        document.getElementById(tdId).innerHTML="否";
                    }

                }else{
                    alertMsg.error("操作失败.");
                }
            },
            error: DWZ.ajaxError
        });
    }

}