.png)
相關(guān)關(guān)鍵詞
關(guān)于我們
最新文章
PHP+jquery+CSS制作頭像登錄窗（仿QQ登陸）
本篇介紹設(shè)計了一個簡單有趣的包含Gravatar頭像的登錄框功能，頭像是基于郵件id從gravatar.com導(dǎo)出的。這篇文章是非?；镜膶用嫔系腃SS實現(xiàn)和幾行Jquery和PHP代碼。我希望這個登錄框設(shè)計對您的web項目給出了一些特殊的味道。在嘗試這個示例前請在Gravatar上先上傳你的頭像.
JavaScript
包含javascript代碼。$(".user").keyup(function(){}---user是input標(biāo)簽的名字，我們通過$(this).val()獲取input的值。如果email值通過了正則表達式，ajax將會請求avatar.php
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js"></script>
<script type="text/javascript" >
$(document).ready(function()
{
$("#username").focus();
$(".user").keyup(function()
{
var email=$(this).val();
var dataString = 'email='+ email ;
var ck_email = /^([\w-]+(?:\.[\w-]+)*)@((?:[\w-]+\.)*\w[\w-]{0,66})\.([a-z]{2,6}(?:\.[a-z]{2})?)$/i;
if(ck_email.test(email))
{
$.ajax({
type: "POST",
url: "avatar.php",
data: dataString,
cache: false,
success: function(html)
{
$("#img_box").html("<img src='http://www.gravatar.com/avatar.php?gravatar_id="+html+"?d=mm' />");
}
});
}
});
});
</script>