关于JQueryAjax文件加载显示文本内容

关于JQueryAjax文件加载显示文本内容

1.webContextPath

Jsp代码:

request.getContextPath()

 

<%
String path = request.getContextPath();
String basePath = request.getScheme() + "://"
+ request.getServerName() + ":" + request.getServerPort()
+ path + "/";
%>

 

<base href="<%=basePath%>">

Ajax:

通过:$.ajax() 返回其创建的XMLHttpRequest对象

 

 

2.代码分析

2.1.jquery_load.html

 <!DOCTYPEhtml>

<htmllang="en">
<head>
    <metacharset="UTF-8">
    <title>Title</title>

    <scripttype="text/javascript"src="js/lib/jquery/1.8.3/jquery.js"></script>
    <scripttype="text/javascript"src="js/my_jquery_load.js"></script>

</head>

<body>

<divid="myDiv"><h2>hello world</h2></div>
<button>通过jquery-ajax改变Div内容</button>

</body>
</html>

 

2.2.my_jquery_load.js

/**
 * Created by kikop on 2017/6/6.
 */

// http://www.w3school.com.cn/jquery/jquery_events.asp


$(document).ready(function() {
    $("button").click(function() {

        //var path=request.getContextPath();   //ERROR

        //$.ajax() 返回其创建的 XMLHttpRequest 对象
        
varhtmlObj= $.ajax({
                //url: "<%=path %>/requestContent.txt",  //注意:这里路径要取全
                
url: "js/requestContent.txt",  //注意:这里路径要取全
                
async: false
            
})
            ;
        $("#myDiv").html(htmlObj.responseText);
    });
});

2.3.requestContent.txt

通过jquery-ajax改变Div内容,这是新的内容。