zoukankan      html  css  js  c++  java
  • 一个简单的 aiax请求例子

    <!DOCTYPE html>
    <html>
    <head>
        <meta http-equiv="content-type" content="text/html;charset=utf-8"/>
        <title>修改折扣</title>
        <script src="http://code.jquery.com/jquery-latest.js"></script>
        <script type="text/javascript">
            $(document).ready(function () {
                method()
            });
            function method() {
                $.ajax({
                    type:"GET",
                    url:"/guest/selectInvestorDiscount",
                    // data:{"id":val},     // data参数是可选的,有多种写法,也可以直接在url参数拼接参数上去,例如这样:url:"getUser?id="+val,
                    //data:"id="+val,
                    async:true,   // 异步,默认开启,也就是$.ajax后面的代码是不是跟$.ajx里面的代码一起执行
                    cache:true,  // 表示浏览器是否缓存被请求页面,默认是 true
                    dataType:"json",   // 返回浏览器的数据类型,指定是json格式,前端这里才可以解析json数据
                    success:function(data){
                        $("#discount").text(data);
                    },
                    error:function(){
                        console.log("发生错误")
                        alert("发生错误");
                    },
                    complete:function(){
                        console.log("ajax请求完事,最终操作在这里完成")
                    }
                });
            }
        </script>
    
        <script>
            function updateDiscount() {
                 var val = $("#discouts").val();
                $.ajax({
                    type:"POST",
                    url:"/guest/upDiscountByType",
                    data:{"discouts":val},     // data参数是可选的,有多种写法,也可以直接在url参数拼接参数上去,例如这样:url:"getUser?id="+val,
                    //data:"id="+val,
                    async:true,   // 异步,默认开启,也就是$.ajax后面的代码是不是跟$.ajx里面的代码一起执行
                    cache:true,  // 表示浏览器是否缓存被请求页面,默认是 true
                    dataType:"json",   // 返回浏览器的数据类型,指定是json格式,前端这里才可以解析json数据
                    success:function(data){
                        console.log("成功的回调")
                        location.reload()
                    },
                    error:function(){
                        console.log("发生错误")
                        alert("发生错误");
                    },
                    complete:function(){
                        console.log("ajax请求完事,最终操作在这里完成")
                        location.reload()
                    }
                });
            }
        </script>
    
    </head>
    <body>
    <div>
        <div>当前折扣:<span id="discount"></span></div>
        <input type="text" id="discouts" placeholder="请输入折扣"/>
        <button onclick="updateDiscount();">修改</button>
    </div>
    
    </body>
    
    </body>
    </html>
  • 相关阅读:
    学习数据结构的网站
    线程的自动释放、挂起、运行
    centos7 odbc mysql
    c++和c不同
    Linux挂载u盘作为本地yum源安装gcc
    构建基于JAVASCRIPT的移动WEB CMS入门——简介(转载)
    数据库SQL优化大总结之 百万级数据库优化方案
    webgl 刷底色的基本步骤
    前端下载文件流并且获取heads中的filename文件名且解决中文乱码的方法
    Python little knowledge
  • 原文地址:https://www.cnblogs.com/tomingto/p/12334808.html
Copyright © 2011-2022 走看看