• ajax请求时data数据格式


    <!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>Document</title>
    </head>
    <body>     
        <form id="login"  method="post" action="result.jsp">
            <input name="user" type="text"/>
            <input name="sex" type="radio" value="man"/>
            <input name="sex" type="radio" value="woman"/>
            interest:
            <input type="checkbox" name="interest" value="piu">PIU
            <input type="checkbox" name="interest" value="dss">DSS
            <input type="checkbox" name="interest" value="ddr">DDR<br>  
            <input type="button" name="submit" value="submit" onclick="getFormInfo();"> 
        </form>
        <script type="text/javascript" src="./../js/jquery.min.js"></script>
        <script type="text/javascript" src="serializeJSON.js"></script>
        <script type="text/javascript" src="test.js"></script>
        <script type="text/javascript">
        //第一种写法(拼接URL)
        function getFormInfo(){
            var name='wen';
            var user='chen';
            $.ajax({
             url: "/login/authenticate?name="+name+"&user="+user,
             type: "POST",
             data:{},
             dataType: "json",
             success: function(data){
                 
              },
              error:function(err){
                console.log(err.statusText);
                console.log('异常');
              }
            });
        }
        //第二种写法(表单序列化为json数据)
        function getFormInfo(){
            var params=$('#login').serializeJSON();
            console.log(params);
            $.ajax({
             url: "http://192.168.10.32:6833/login/authenticate",
             type: "POST",
             data:params,
             cache:false,
             dataType: "json",
             success: function(data){
                 
              },
              error:function(err){
              }
            });
        }
        // 第三种写法(表单序列化为字符串)
        function getFormInfo(){
            var params=$('#login').serialize();
            console.log(params);
            $.ajax({
             url: "http://192.168.10.32:6833/login/authenticate",
             type: "POST",
             data:params,
             cache:false,
             dataType: "json",
             success: function(data){
                 
              },
              error:function(err){
              }
            });
        }
        //第四种写法(带json数据)
        function getFormInfo(){
            $.ajax({
             url: "http://192.168.10.32:6833/login/authenticate",
             type: "POST",
             data:{
                name:'chem',
                user:'wen'
             },
             cache:false,
             dataType: "json",
             success: function(data){
                 
              },
              error:function(err){
              }
            });
        }
        //第五种写法(拼接data)
        function getFormInfo(){
            var name='chen';
            var user='wen';
            $.ajax({
             url: "http://192.168.10.32:6833/login/authenticate",
             type: "POST",
             data:'name='+name+'&user='+user,
             cache:false,
             dataType: "json",
             success: function(data){
                 
              },
              error:function(err){
              }
            });
        }
        //第六种写法(既有全部直接获取表单中的数据又有单独出来的数据)
        function getFormInfo(){
            var params=$('#login').serializeJSON();
            console.log(params);
            params.height='20';
            $.ajax({
             url: "http://192.168.10.32:6833/login/authenticate",
             type: "POST",
             data:params,
             cache:false,
             dataType: "json",
             success: function(data){
                 
              },
              error:function(err){
              }
            });
        }
        </script>
    </body>
    </html>
  • 相关阅读:
    WordPress修改后台登录地址
    android开发之浅谈viewpager
    android开发之viewpager and Fragment
    android开发之 广播机制
    android开发之 SQLite(数据库)
    前端目标——天猫网页
    android 开发之Toast
    centos8 单机安装k8s
    mysql 查看库大小
    idea 常见问题
  • 原文地址:https://www.cnblogs.com/tanzq/p/10231504.html
Copyright © 2020-2023  润新知