• jQuery的三种Ajax模式


    <scrīpt type="text/javascrīpt">
    //$.ajax()方式
    $(document).ready(function (){
       $('#send_ajax').click(function (){ //直接把onclick事件写在了JS中,而不需要混在XHTML中了
              var params=$('input').serialize(); //序列化表单的值,与prototype中的form.serialize()相同
              $.ajax({
                   url :'ajax_test.php'
    ,  //后台处理程序
                   type:'post',    //数据发送方式
                   dataType:'json',   //接受数据格式
                   data:params,   //要传递的数据
                   success:update_page  //回传函数(这里是函数名)
                   });
            });
    });

    function update_page (json) { //回传函数实体,参数为XMLhttpRequest.responseText
           var str="姓名:"+json.username+"<br />";
           str+="年龄:"+json.age+"<br />";
           str+="性别:"+json.sex+"<br />";
           str+="工作:"+json.job;
           $("#result").html(str);
    }

    //$.post()方式:
    $(function (){ //$(document).ready(function (){ 的简写
          $('#test_post').click(function (){
                    $.post('ajax_test.php',
                   {username:$('#input1').val(),age:$('#input2').val(),sex:$('#input3').val(),job:$('#input4').val()},
                    function (data){ //回传函数
                    var myjson='';
                   eval('myjson='+data+';');
                   $('#result').html("姓名:"+myjson.username+"<br />工作:"+myjson['job']);
                   });
           });
    });

    //$.get()方式:
    $(function (){
             $('#test_get').click(function (){
                         $.get('ajax_test.php',
                         {username:$("#input1").val(),age:$("#input2").val(),sex:$("#input3").val(),job:$("#input4").val()},
                         function  (data) {
                               var myjson='';
                               eval("myjson="+data+";");
                               $("#result").html(myjson.job);
                          });
               });
    });
    </scrīpt>

  • 相关阅读:
    可重入与不可重入
    clash for windows的一些常用使用方法
    解决php7 表单提交不了太多元素
    CppSQLite3 的一些容易错误点
    Dckerfile CMD不同格式的区别
    async/await的理解
    CSS 学习三
    css学习一
    css学习二
    css学习四
  • 原文地址:https://www.cnblogs.com/goooto/p/1106652.html
Copyright © 2020-2023  润新知