您的位置：首页 > Web前端 > JQuery

【jquery】ajax实现用户名验证

2016-11-14 00:00 211 查看

1.导入jQuery库
2.获取name="username" 的节点:UserName
3.为username添加change响应函数
3.1.获取username的value属性值，去除前后前后空格且不为空，这边发送ajax请求
3.2.发送ajax 请求检验username是否可用
3.3.在服务端直接返回html的片段：<font color="red">用户名可用</font>
3.4.在客户端浏览器把服务端返回的结果之间添加到#message的html中

[JavaScript]代码

<script type="text/javascript">
$(function(){
$(":input[name='username']").change(function(){
var val=$(this).val();
val=$.trim(val);
if(val!=""){
var url="url";
var args={"username":val,"time":new Date()};
$.post(url,args,function(data){
$("#message").html(data);
});
}
});
});
</script>

[HTML]代码

<body>
<form action="" method="post">
UserName:<input type="text" name="username"/><br/>
<div id="message"></div><br/>
<input type="submit" value="Submit"/>
</form>
</body>

内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理

标签：

相关文章推荐

新的分享

章节导航