JQ AJAX

用AJAX方法不刷新网页使用下拉列表连接数据库

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
<script src="jquery-1.11.2.min.js"></script>
</head>

<body>
<select id="sel">

</select>
</body>
<script type="text/javascript">
$(document).ready(function(e) {

    $.ajax({

        url:"ajaxchuli.php",         //处理页面
        data:{},                     //要提交的值
        type:"POST",                 //提交方式
        dataType:"TEXT",             //返回类型
        success: function(ss){         //回调函数

            var hang=ss.split("|");
            var str="";
            for(var i=0;i<hang.length;i++)
            {
                var lie=hang[i].split("^");    

                str=str+"<option value=‘"+lie[0]+"‘>"+lie[1]+"</option>"
            }

            $("#sel").html(str);

            }

        });

});
</script>
</html>

<?php
include("dbda.class.php");
$db=new dbda;

$sql="select * from nation";
$attr=$db->Query($sql);

$str="";

foreach($attr as $v)
{
    $str=$str.implode("^",$v);
    $str=$str."|";
}

$str=substr($str,0,strlen($str)-1);

echo $str;

用AJAX方法实现判断账号是否已注册

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
<script src="jquery-1.11.2.min.js"></script>
</head>

<body>
<div>用户名:<input type="text" id="uid" />
<span id="xx"></span></div>
</body>
<script type="text/javascript">
$(document).ready(function(e) {
    $("#uid").blur(function(){

        var uid=$(this).val();

        //调AJAX
        $.ajax({

            url:"uidchuli.php",
            data:{u:uid},
            type:"POST",
            dataType:"TEXT",
            success: function(date){

                if(date.trim()=="ok")
                {
                    var str="可以使用";
                    $("#xx").html(str);
                    $("#xx").css("color","#0F0");
                }
                else
                {
                    var str="已存在";
                    $("#xx").html(str);
                    $("#xx").css("color","#F00");
                }

                }

            });

        })
});

</script>
</html>

<?php
$uid=$_POST["u"];

include("dbda.class.php");
$db=new dbda;

$sql="select count(*) from users where uid=‘{$uid}‘";
$attr=$db->Query($sql);

if($attr[0][0]>0)
{
    echo"no";
}
else
{
    echo"ok";
}

时间: 2024-10-19 09:13:28

JQ AJAX的相关文章

原生Ajax 和Jq Ajax

前言:这次介绍的是利用ajax与后台进行数据交换的小例子,所以demo必须通过服务器来打开.服务器环境非常好搭建,从网上下载wamp或xampp,一步步安装就ok,然后再把写好的页面放在服务器中指定的位置.打开时,在浏览器地址栏输入"localhost/指定页面"或者"127.0.0.1/指定页面"打开. 下面列出demo的HTML.PHP.原生ajax .jq ajax代码. HTML代码: <!doctype html> <html> &

jq ajax传递json对象到服务端及contentType的用法

目录 0.一般情况下,通过键值对的方式将参数传递到服务端 1.ajax 传递复杂json对象到服务端 2.content-Type 对asp.net mvc项目的重要性 0.一般情况下,通过键值对的方式将参数传递到服务端 0.1 客户端代码: $.ajax({ url: 'TestHandler.ashx', type: 'post', data: { name: "admin", age: 10 }, dataType: 'text', success: function (data

大三在校生的传智120天的1200小时.net(十四) 关于jq ajax封装以及error的报错参数

jq的ajax完整版本 $.ajax({ url: "GetCityByPId.ashx", data: {pId:pid}, dataType: "JSON", type: "GET", cache:false, success: function (data) { $("#city").empty(); for (var key in data) { var cityId = data[key].CityId; var c

【笔记】关于jq $.ajax 函数 success回调函数不能赋正确值或返回正确值的问题

最近在一个项目里面打算实现如下功能: 当我注册账号的时候当输入账号完毕后输入框失焦时执行一个 ajax 请求,验证账号是否被注册,并未这个输入框的 isCorrect属性赋值,如果没有被注册 isCorrect属性值为"true",否则为 "false".代码如下: ajax: function(obj){ /* { elem: //验证的元素, hintsContent: //提示框元素, errorColor: //错误时显示的颜色, url: //后台处理页地

JQ+AJAX实现多级联动

利用JQ与AJAX实现三级联动实现的效果: 当前两级改变时,后边一级或两级都会改变: 使用的数据库: html代码: <!doctype html> <html lang="en"> <head> <meta charset="UTF-8" /> <title>Document</title> <script src="jquery-1.11.2.min.js" typ

jq ajax封装

//ajax公共方法,zs 2017-06-14 $.extend({ //比jq的ajax多了的参数: //salert是否在请求成功后弹出后台的SuressStr字段值 //ealertStr:请求出错 majax: function (a) { if (typeof a === "object") { var defaultOption = { url: "", async: true, cache: true,//dataType 为 script 和 js

vue 结合JQ ajax 作用域会改变

简单的数据表格的功能,   用到了vue 和JQ // 获取搜索 提示 数据 getData: function() { $.post(searchTipUrl, { q: this.q }, function(data) { this.serachUl = true; // 这里的this 不是vue 的了 this.myData = data; // console.log(_self.myData.length); }) }, // 获取搜索 提示 数据 getData: function

通过php jq ajax 提交form表单

参考http://www.php100.com/html/webkaifa/PHP/PHPyingyong/2013/0619/13568.html html <div id="contact_form"> <form name="contact" method="post" > <label for="name" id="name_label">姓名</label

JQ Ajax 上传文件

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <title>FormData</title>