欧美bbbwbbbw肥妇,免费乱码人妻系列日韩,一级黄片

jquery+ajax實(shí)現(xiàn)注冊(cè)實(shí)時(shí)驗(yàn)證實(shí)例詳解

 更新時(shí)間:2015年12月08日 15:03:22   作者:hello_ljfbest  
這篇文章主要介紹了jquery+ajax實(shí)現(xiàn)注冊(cè)實(shí)時(shí)驗(yàn)證的方法,結(jié)合實(shí)例形式較為詳細(xì)的分析了jQuery基于ajax請(qǐng)求實(shí)現(xiàn)注冊(cè)時(shí)無(wú)刷新驗(yàn)證的相關(guān)技巧,需要的朋友可以參考下

本文實(shí)例講述了jquery+ajax實(shí)現(xiàn)注冊(cè)實(shí)時(shí)驗(yàn)證。分享給大家供大家參考,具體如下:

當(dāng)我們注冊(cè)一個(gè)用戶時(shí),會(huì)實(shí)時(shí)提示該用戶的信息是否可用,這就是ajax的應(yīng)用,很久以前就看過這個(gè)實(shí)現(xiàn)了,今天又看了一遍,給記錄下來(lái)O(∩_∩)O哈!

先介紹下ajax中$.get,由于$.post用法和$.get大同小異就不再介紹了:

這是一個(gè)簡(jiǎn)單的 GET 請(qǐng)求功能以取代復(fù)雜 $.ajax 。請(qǐng)求成功時(shí)可調(diào)用回調(diào)函數(shù)。如果需要在出錯(cuò)時(shí)執(zhí)行函數(shù),請(qǐng)使用 $.ajax。

復(fù)制代碼 代碼如下:
$(selector).get(url,data,success(response,status,xhr),dataType)

參數(shù) 描述
url 必需。規(guī)定將請(qǐng)求發(fā)送的哪個(gè) URL。
data 可選。規(guī)定連同請(qǐng)求發(fā)送到服務(wù)器的數(shù)據(jù)。
success(response,status,xhr)

可選。規(guī)定當(dāng)請(qǐng)求成功時(shí)運(yùn)行的函數(shù)。

額外的參數(shù):

  • response - 包含來(lái)自請(qǐng)求的結(jié)果數(shù)據(jù)
  • status - 包含請(qǐng)求的狀態(tài)
  • xhr - 包含 XMLHttpRequest 對(duì)象
dataType

可選。規(guī)定預(yù)計(jì)的服務(wù)器響應(yīng)的數(shù)據(jù)類型。

默認(rèn)地,jQuery 將智能判斷。

可能的類型:

  • "xml"
  • "html"
  • "text"
  • "script"
  • "json"
  • "jsonp"
請(qǐng)求 test.php 網(wǎng)頁(yè),忽略返回值:
復(fù)制代碼 代碼如下:
$.get("test.php");

更多示例:

例子 1

請(qǐng)求 test.php 網(wǎng)頁(yè),傳送2個(gè)參數(shù),忽略返回值:

復(fù)制代碼 代碼如下:
$.get("test.php", { name: "John", time: "2pm" } );

例子 2

顯示 test.php 返回值(HTML 或 XML,取決于返回值):

$.get("test.php", function(data){
 alert("Data Loaded: " + data);
});

例子 3

顯示 test.cgi 返回值(HTML 或 XML,取決于返回值),添加一組請(qǐng)求參數(shù):

$.get("test.cgi", { name: "John", time: "2pm" },
function(data){
  alert("Data Loaded: " + data);
});

下面貼上我的代碼:

<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>用戶注冊(cè)</title>
<script type="text/javascript" src="jquery/jquery-1.5.2.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$("#username").focus();
$("#username").keyup(function()
{
  name= $("#username").val();//val()方法返回或設(shè)置被選元素的值。
  if(len(name)< 4)//調(diào)用下面的自定義len函數(shù)
  $("#username1").html("<font color=red>注冊(cè)名稱必須大于等于2位</font>");
  else
  $("#username1").html("<font color=red>符合要求</font>");//html() 方法返回或設(shè)置被選元素的內(nèi)容 (inner HTML)。
});
$("#username").blur(function(){
name= $("#username").val();
$.get("t1.php", { username:name } ,function(data){//判斷數(shù)據(jù)庫(kù)中是否存在此用戶名 重點(diǎn)$.get,$.post t1.php在下面
  if(data==1) {$("#username1").html("<font color=green>符合要求</font>");}
  else {$("#username1").html("<font color=green>已被占用</font>");}
});
});
});
function len(s) {//若為漢字之類的字符則占兩個(gè)
var l = 0;
var a = s.split("");
for (var i=0;i<a.length;i++) {
 if (a[i].charCodeAt(0)<299) {
 l++;
 } else {
 l+=2;
 }
}
return l;
}
</script>
</head>
<body>
<form name="fram" action="register.php" onsubmit="return docheck();">
<table width="330" border="0" align="center" cellpadding="5" bgcolor="#eeeeee">
<tr>
  <td>用戶名:</td>
  <td><input name="username" type="text" id="username" /></td><td><div id="username1"></div></td>
</tr>
</table>
</form>
</body>
</html>

t1.php:

<?php 
$link=mysql_connect("localhost","root","");
mysql_select_db("test");
mysql_query("set names utf8");//
$sql="select * from user where user='".$_GET['username']."'";//
  $result=mysql_query($sql) or die(mysql_error());
$num=mysql_affected_rows();
if($num==0)
$msg=1;
else
  $msg=0;
echo $msg;//返回值
mysql_close($link);
?>

希望本文所述對(duì)大家jQuery程序設(shè)計(jì)有所幫助。

相關(guān)文章

  • JQuery樣式與屬性設(shè)置方法分析

    JQuery樣式與屬性設(shè)置方法分析

    這篇文章主要介紹了JQuery樣式與屬性設(shè)置方法,結(jié)合實(shí)例形式分析了jQuery屬性的獲取與設(shè)置、以及樣式的添加與刪除相關(guān)操作技巧,需要的朋友可以參考下
    2019-12-12
  • 解析jQueryEasyUI的使用

    解析jQueryEasyUI的使用

    使用EasyUI最好的方法不是學(xué)會(huì),所有的東西都敲一遍,你也沒辦法敲得完,而是找到一個(gè)好的文檔。本文提供文檔的下載,并對(duì)jQueryEasyUI的使用進(jìn)行實(shí)例解析,需要的朋友可以參考下
    2016-11-11
  • 淺談jQuery 選擇器和dom操作

    淺談jQuery 選擇器和dom操作

    下面小編就為大家?guī)?lái)一篇淺談jQuery 選擇器和dom操作。小編覺得挺不錯(cuò)的,現(xiàn)在就分享給大家,也給大家做個(gè)參考。一起跟隨小編過來(lái)看看吧
    2016-06-06
  • jQuery同步提交示例代碼

    jQuery同步提交示例代碼

    這篇文章主要介紹了jQuery同步提交實(shí)現(xiàn)方法,實(shí)例分析了jQuery基于ajax實(shí)現(xiàn)同步提交的具體技巧,以及jQuery版本更新的使用注意事項(xiàng),需要的朋友可以參考下
    2015-12-12
  • 深入淺出 jQuery中的事件機(jī)制

    深入淺出 jQuery中的事件機(jī)制

    本文重點(diǎn)給大家介紹jquery中的事件機(jī)制,涉及到onload和ready兩者的區(qū)別介紹,非常不錯(cuò),具有參考借鑒價(jià)值,感興趣的朋友一起看下吧
    2016-08-08
  • jquery 選項(xiàng)卡效果 新手代碼

    jquery 選項(xiàng)卡效果 新手代碼

    對(duì)jquery只是才涉足,如有不適合,請(qǐng)各位多多指教。
    2011-07-07
  • Jquery中的CheckBox、RadioButton、DropDownList的取值賦值實(shí)現(xiàn)代碼

    Jquery中的CheckBox、RadioButton、DropDownList的取值賦值實(shí)現(xiàn)代碼

    隨著Jquery的作用越來(lái)越大,使用的朋友也越來(lái)越多。在Web中,由于CheckBox、 Radiobutton 、 DropDownList等控件使用的頻率比較高,就關(guān)系到這些控件在Jquery中的操作問題
    2011-10-10
  • 用JQUERY增刪元素的代碼

    用JQUERY增刪元素的代碼

    用JQUERY增刪元素的代碼,需要的朋友可以參考下
    2012-02-02
  • 關(guān)于jquery中attr()和prop()方法的區(qū)別

    關(guān)于jquery中attr()和prop()方法的區(qū)別

    今兒是腳本之家小編給大家總結(jié)的jquery中attr()和prop()方法的區(qū)別,感興趣的朋友參考下
    2018-05-05
  • jquery.hotkeys監(jiān)聽鍵盤按下事件keydown插件

    jquery.hotkeys監(jiān)聽鍵盤按下事件keydown插件

    jquery.hotkeys就是網(wǎng)頁(yè)是監(jiān)聽用戶按鍵要用到的jquery庫(kù),這里簡(jiǎn)單介紹下使用方法,需要的朋友可以參考下
    2014-05-05

最新評(píng)論