zoukankan      html  css  js  c++  java
  • JQuery中实现Ajax

    简单小案例:

    $("input").click(function() {

            $.get("test.txt",function(data){

     

                $("h1").html(data);

            });

        });

    JQuery中,$.get()表示发出了一个异步的get请求;

    语法:

    $.get(路径?k=v&k=v,回调函数)

    回调函数系统会自动的注入一个实参,就是哪个文本文件的内容;

    JQuery中,$.post()表示发出了一个异步的post请求;

    语法:

    $.post(路径,{k:v,k:v},回调函数);

     $.get("chaxun.php?jiangyaochaxundeyonghuming="+$(this).val(),function(data){

     

                if(data == "you"){

     

                    $(".tip").css("color","red").html("已经被占用了,换一个吧!");

                }else if( data == "meiyou"){

     

                    $(".tip").css("color","green").html("恭喜,用户名可以使用");

     

                }

            })

    注意:get请求的路径上面的黄底红字是真正的路径(URL),粉底儿蓝字是缀加的参数;

    Data表示后台输出的结果;

    <?php

        mysql_connect("localhost","root",123456);

        mysql_select_db("student");

        mysql_query("SET NAMES UTF8");

     

        $yaochaxundeyonghuming = $_GET["jiangyaochaxundeyonghuming"];

     

        // sql语句

        $sql = "SELECT * FROM banji0219 WHERE xingming = '{$yaochaxundeyonghuming}'";

        // 执行sql

        $result = mysql_query($sql);

        // 把输出结果转换成个数

        $tiaoshu = mysql_num_rows($result);

        if( $tiaoshu > 0){

            echo "you";

        }else{

            echo "meiyou";

        }

     

    ?>

    mysql_num_rows()//统计条数

    $.post("zhuce.php",{

                yonghuming:$("#yonghuming").val(),

                mima:$("#mima").val()

     

            },function(data){

                if( data == "charuchenggong" ){

     

                    alert("恭喜,成功");

     

                }else if( data == "shibai" ){

     

                    alert("sorry");

                }

            });

    红色是URL地址,紫字是参数,格式是JSON格式;data是后台的输出的结果;

    前台页面得到data后,可以用DOM方法自由的局部“刷新”页面!

  • 相关阅读:
    支付宝生活号内置浏览器长按保存二维码
    Web前端发展史
    ES6语法
    Java多线程
    Java基础知识
    静态库和动态库的使用
    Gcc的使用
    Vim的使用
    力扣345. 反转字符串中的元音字母
    力扣605. 种花问题
  • 原文地址:https://www.cnblogs.com/pms01/p/6842393.html
Copyright © 2011-2022 走看看