自己公司： jQuery 异步加载的写法 -优快云博客

本文链接：https://blog.youkuaiyun.com/JACKASDFGHJKL/article/details/84199626

本文介绍了使用jQuery实现异步加载的两种方法。第一种方法通过弹窗确认后取消FAQ，并利用$.post请求更新页面内容；第二种方法展示了如何通过文本框输入触发异步请求并更新隐藏字段。

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

j@uery 异步加载的方法

第一版：

1、方法：
function cancleFaq(faqID) {
    if (confirm("你确定要取消吗？")) {
        if (faqID != null && faqID != '') {
            var url = "${_currConText}/ask/cancleFaq.shtm";
            $.post(url, {faqID:faqID, _r:Math.random()}, function(data){
                $("#data").html(data);
                   var result = $("#data_result").val();
                   alert(result);
                   if (result.indexOf("成功") > 0) {
                       location = "<c:url value='/ask/list.shtm'/>";
                   }
                   else {
                       return false;
                   }
            });
        }
    }
}

2、要访问的cancleFaq.jsp页面：

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%@ page import="java.util.HashMap" %>
<%@ taglib tagdir="/WEB-INF/tags/ask" prefix="ask" %>
<%@ include file="/WEB-INF/jsp/common/common.jsp" %>
<%@ include file="/WEB-INF/jsp/login/loginCheck.jsp" %>
<ask:cancleFaq faqID="${ param.faqID }" var="result" userID="${ loginMember.userID }"></ask:cancleFaq>
<input type="hidden" id="data_result" value="${ result }"/>

3、成功之后，返回list.jsp页面
location = "<c:url value='/ask/list.shtm'/>";

第二版：方法如下，

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%@ include file="/WEB-INF/jsp/common/common.jsp" %>
<%@ taglib uri="http://java.sun.com/jsp/jstl/functions" prefix="fn" %>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>
<%@ taglib uri="http://java.sun.com/jsp/jstl/fmt" prefix="fmt" %>
<%@ taglib uri="http://java.sun.com/jsp/jstl/sql" prefix="sql" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<script src="http://code.jquery.com/jquery-latest.min.js"></script>
</head>
<script>
     function ckc(vl){
     var isAskUrl = "<c:url value='/ask/ajax/isJson2.shtm' />"
     var numh=vl.value;
     $.post(isAskUrl,{numh:numh,ranNum:Math.random()},function(data){
           $("#data").html(data);
           var result = $("#data_result").val();
    //      alert(result);
        document.getElementById("inputid").value=result;
      });
    }
</script>

<body>
<div id="data"></div>
<input type="text" value="" onpropertychange="ckc(this);"/><br></br>
<input type="text" value="" id="inputid"/>
</body>
</html>

访问的isJson2. jsp页面如下：

<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<%@ include file="/WEB-INF/jsp/common/common.jsp" %>
<%@ taglib tagdir="/WEB-INF/tags/fee" prefix="fee" %>
<%
String StrVal=request.getParameter("numh");
%>
<input type="hidden" id="data_result" value="<%=StrVal %>"/>