Ajax编程初探

来源:互联网 发布:淘宝申请退款时间5天 编辑:程序博客网 时间:2024/06/06 03:03

接上一篇 http://blog.csdn.net/qq_24942951/article/details/74085736

这里要用到 jquery.mim.js 文件我将其上传至百度云,链接如下:
https://pan.baidu.com/s/1i5MK0tB

1. 在 webapp 目录下创建 js 文件夹,将 jquery.mim.js 拷贝至新建的 js 文件下

2. 编写网页,创建 demo.html 代码如下

<!DOCTYPE html>        <html>            <head>                <meta charset="UTF-8">                <title>Hello</title>                <script type="text/javascript" src="js/jquery.min.js"></script>                <script type="text/javascript">                $(function(){                    console.log("Hello World!");                    //加载以后 绑定 按钮的点击事件                    $('#demo').click(getValue);                });                // test/hello.do                function getValue(){                    //发起AJAX请求, 从服务器获取数据                     var url="test/hello.do";                    $.get(url, function(msg){                        //在result区域显示结果                        console.log(msg);                        $('#result').html(msg);                                    });                }                </script>            </head>            <body>                <h1>Hello!</h1>                <input type="button" id="demo" value="Try">                <p id="result"></p>            </body>        </html>

3. 编写完成后重新发布并测试,输入如下地址

http://localhost:8080/myproject/demo.html

出现如下效果页面
这里写图片描述

原创粉丝点击