//页面装载完成
$(document),ready(function{
alert("ceshi"); //测试一下
$("#verifyDutton").click(function(){ // 通过id找到button节点 再执行click时间
var userName = $("#userName").val(); // 获取文本框节点的值
if(userName == ""){
alert("用户名不能为空！");
}else{ 不会出现乱码
$.get("http:127.0.0.1:8080/jQuery/UserVerifyuserName="+encodrURl(encodrURl(userName)),null,function(response){ // 服务器端接受数据 $.get 和 $.post 2中方法
// response 接收服务器端返回的数据 填充到div中
$("#result").html(response);
});
}
});
$("#userName").keyup(function(){ // 找到文本框 执行键盘弹起事件
// userName：jquery对象
var value = $(this).val(); // 获取当前文本框的内容
if(value == ""){
// 值为空让边框变成红色。。。
$(this).addClass("userText");
}else{
//去掉边框和背景图
$(this).removeClass("userText");
}
});
});
css加载的样式类
.userText{
border:1px solid red // 边框是：1像素；实线的；红色
background-image:url(); // 加载图片的路径
background-repeat:repeat-x; //图片在横向上不断的重复
background-position:botton: //图片在文本框的下方加载
}
HTML 代码
<body>
请输入用户名：<input type="text" id="userName" class="userText"/>
<input type="button" value="校验" id="verifyButton"/>
<div id="result"></div> // 用户名可以使用
</body>
分享到：
相关推荐
"form表单验证.rar" 提供的是一组使用JavaScript实现的经典表单验证特效动画，可以帮助开发者学习和理解如何优雅地处理用户输入的验证过程。下面我们将详细探讨JavaScript、前端开发、HTML和CSS在表单验证中的应用。...
在提供的压缩包"原生js简单表单验证插件特效源码.zip"中，132687015034188698可能是源码文件的ID或者哈希值，无法直接提供文件内容。通常，这样的源码文件会包含JavaScript代码文件、HTML示例文件以及可能的CSS样式...
总的来说，"jquery表单验证特效"项目涵盖了前端开发中的关键知识点，包括jQuery的事件处理、DOM操作、正则表达式验证以及与CSS结合实现的用户体验优化。通过这个项目，开发者可以学习到如何创建功能完备、用户体验...
本项目“css3实现结账Form表单”正是一个利用CSS3技术来创建具有动态效果的结账表单的示例。下面我们将详细探讨这个主题中的关键知识点。 首先，我们要理解**CSS3选择器**。在这个结账表单中，CSS3选择器被用来精确...
在网页开发中，表单验证是必不可少的一部分，它确保用户输入的数据符合预设的规则，从而提高用户体验并减少服务器端的处理压力。`jQuery Easyform`是一个轻量级且易于使用的JavaScript插件，专为jQuery设计，用于...
在网页开发中，表单验证是一项至关重要的任务，它确保用户输入的数据符合预期，从而减少错误数据的提交，提升用户体验。jQuery作为一个强大的JavaScript库，提供了丰富的API和插件，使得表单验证变得简单易行。本...
在IT行业中，前端开发是至关重要的一个环节，特别是在用户交互设计上，表单验证扮演着不可或缺的角色。"js手机注册表单验证代码.zip" 文件提供了一种简单的解决方案，用于实现手机注册过程中的用户输入验证。这个...
接着，表单验证是必不可少的环节，HTML5提供了内置的表单验证功能，如`required`属性可以确保字段不为空，`pattern`属性则可以设置正则表达式，确保输入符合特定格式，例如身份证号码的校验。此外，`form`元素和`...
总的来说，这个压缩包提供了一个很好的机会，让我们了解和实践HTML5在现代登录界面设计中的应用，包括表单验证、用户体验优化以及安全性考虑。对于想要提升自己前端技能的开发者来说，这是一个不容错过的实例。
【Form表单模拟美化插件特效代码】是一个专注于提升网页中Form表单视觉效果的工具。在网页设计中，表单元素（如输入框、选择框等）的样式通常是浏览器默认的，这往往不能满足设计师对界面美观度的追求。这款插件就是...
本教程将深入讲解如何使用jQuery库来实现网页注册表单的验证功能，尤其关注“jQuery网页注册表单验证代码”这一主题。 jQuery是一个广泛使用的JavaScript库，它简化了HTML文档遍历、事件处理、动画以及Ajax交互。在...
jQuery Live Form Validation是一个用于创建表单验证的jQuery插件。支持自定义校验规则，既可以在输入的时候实时校验，也可以在提交的时候校验。提示信息的样式完全可以通过CSS定义。
4. **JavaScript**：负责添加交互性，比如表单验证（检查用户名和密码是否为空，格式是否正确等），以及动态效果（如表单验证失败后的错误提示）。 5. **jQuery**：是一个JavaScript库，简化了DOM操作、事件处理、...
JavaScript是一种广泛应用于网页...这个压缩包中的源码可能包含了更详细的特效，例如动画效果或更复杂的验证规则，但核心思想就是以上所述。通过熟练掌握这些基础知识，开发者可以创建出更安全、更友好的用户注册体验。
总结来说，要实现"jQuery支持拖动的弹出窗口登录和注册表单提交验证特效"，我们需要结合使用jQuery UI的`draggable()`和`dialog()`方法创建可拖动的模态对话框，利用jQuery的事件处理和Ajax功能进行表单验证和数据...
"8种jQuery表单特效.zip"这个压缩包文件显然是一个包含了一系列教程或示例，旨在展示如何利用jQuery来增强表单的用户体验。以下是对这些特效的详细说明： 1. **自动填充(AutoFill)**：这种特效可以在用户输入表单...
// 表单验证成功后的回调函数，form参数为当前表单对象 alert("表单提交成功！"); } }); }); ``` Validform还支持自定义验证方法，可以通过`regex`或`callback`属性调用。`regex`用于指定正则表达式进行验证，...
【CSS3数字验证表单 3D折叠验证提示】是一种创新的前端技术应用，它结合了CSS3的新特性，为用户提供了更为直观、交互性更强的表单验证体验。在这个特性的实现中，主要涉及以下几个核心知识点： 1. **CSS3选择器**：...
【jQuery实现企业开户资质表单验证图片上传特效】 在企业开户流程中，通常需要用户提供一系列的资质证明，如营业执照、法人身份证等。为了确保提交的信息完整且符合规范，开发一个功能完善的表单验证和图片上传系统...