jQuery表单美化插件jqTransform

jQuery Form表单美化插件jqTransform,非常实用的jQuery插件,自动把你整个Form表单进行美化处理,包括SELECT下拉框、文本框、单选、复选框、按钮等,当然不支持input file文件选择框,这个可以参照我们之前的input file选择框美化教程进行改造,在浏览器兼容方面,兼容 ie 6+, safari 2+, firefox 2+,

1.加载jQuery和插件

<script type="text/javascript" src="js/jquery.js"></script>  <script type="text/javascript" src="js/jquery.jqtransform.min.js"></script>

2.HTML内容

<form class="jqtransform">  <div class="rowElem">  <label for="name">Name:</label>  <input type="text" name="name"/>  </div>  <div class="rowElem"><input type="submit" value="send"/></div>  </form>

3.函数调用

<script type="text/javascript">  $(function() {      $("form.jqtransform").jqTransform();  });  </script>

代码来自codego.net

时间: 2024-08-02 10:57:53

jQuery表单美化插件jqTransform的相关文章

JavaScript/jQuery 表单美化插件小结

Niceforms Niceforms是一款独立的表单美化工具,当前版本为2.0 官方主页:http://www.emblematiq.com/lab/niceforms/ 官方演示:http://www.emblematiq.com/lab/niceforms/demo/niceforms.html GitHub:https://github.com/emblematiq/Niceforms 使用方法,在页面头部引入以下脚本及样式即可: 复制代码 代码如下: <link href="ni

jQuery和CSS3超酷表单美化插件

这是一款效果非常精美炫酷的jQuery和CSS3联系方式表单美化插件.大多数网站上都有让用户填写的联系方式表单,一个设计良好的表单能够大大的提升用户的体验度.该表单美化插件在原生HTML表单的基础上进行加工,并使用jQuery来制作label动画,使表单样式更加大方得体. 这个表单美化插件中包含了常用的表单元素:输入框.下拉框.单选按钮.复选框和文本框. 在线演示:http://www.htmleaf.com/Demo/201503121507.html 下载地址:http://www.html

【jQuery基础学习】06 jQuery表单验证插件-Validation

jQuery的基础部分前面都讲完了,那么就看插件了. 关于jQuery表单验证插件-Validation validation特点: 内置验证规则:拥有必填.数字.E-Mail.URL和信用卡号码等19类内置验证规则 自定义验证规则:可以很方便地自定义验证规则 简单强大的验证信息提示:默认了验证信息提示,并提供了自定义覆盖默认提示信息的功能 实时验证:可以通过keyup或者blur事件触发验证,而不仅仅在表单提交的时候验证 使用方法: 引用jQuery库和Validation插件 <script

表单美化插件

Form Effect - 表单美化插件 一个jQuery样式插件,帮助你对表单中的控件进行式样控制. 1)Formly这个基于jQuery的表单美化插件,并带有表单校验功能. http://thrivingkings.com/formly/ 2)jQuery Tags Input这个jQuery插件能够将一个简单的文本输入转换成一个漂亮的Tag列表. http://xoxco.com/clickable/jquery-tags-input 演示地址: http://xoxco.com/clic

【jquery】Validform,一款不错的 jquery 表单验证插件

关于 Validform 这是一款很不错的 jquery 表单验证插件,它几乎能够满足任何验证需求,仅仅一行代码就能搞定整站的表单验证. $('form').Validform(); 为什么能如此方便?插件的核心思想就是把所有的验证条件及验证提示信息绑定到每个表单元素,让验证代码在执行时只是核对表单下各元素的值是否跟绑定的验证条件相符,这样你可以随便添加或者去掉任一表单元素而不必修改验证代码,从而使仅用一行代码去完成整站的表单验证的梦想成为现实! 功能简介 可以在 input 上直接绑定正则,可

jQuery表单验证插件----通过name属性来关联字段来验证,改变默认的提示信息,将校验规则写到 js 代码中

一.下载依赖包 网盘下载:https://yunpan.cn/cryvgGGAQ3DSW  访问密码 f224 二. 添加一个另外一个插件jquery.validate.messages_cn.js. 改变默认提示方式. 三.jQuery表单验证插件----通过name属性来关联字段来验证,将校验规则写到 js 代码中. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.

jQuery表单验证插件----利用jquery.metadata.js将校验规则写到控件中

一.下载依赖包 网盘下载:https://yunpan.cn/cryvgGGAQ3DSW  访问密码 f224 二. 添加一个另外一个插件jquery.metadata.js 并把校验规则写在控件里面. 三.需要改写触发校验的方式. $("#commentForm").validate({meta: "validate"}); 四.详细代码如下: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transit

JQuery 表单校验插件 validate 实践纪录

JS诞生其中一个目的就是将, 服务器端的校验在客户端提前完成, 以避免用户提交数据后, 后台校验报错的糟糕用户体验. 基于JQuery库的有很多优秀的插件, 其中对于浏览器端表单进行验证的基本功能也有插件对应, validate插件便是一个. 官网地址 : http://jqueryvalidation.org/ 官网文档:http://jqueryvalidation.org/documentation/ 下面网址是开发者提供的demo, 代码可下载, 可以给大家提供参考: http://jq

JQuery表单验证插件EasyValidator,超级简单易用!

本插件的宗旨是:用户无需写一行JS验证代码,只需在要验证的表单中加入相应的验证属性即可,让验证功能易维护,可扩展,更容易上手. DEMO中已经包含了常用的正则表达式,可以直接复用,为了考虑扩展性,所以针对不同用户特殊需求,自行写正则吧. 顺便AD下刚出炉的小站,欢迎捧场:www.paipaiyou.com EasyValidator实现的功能: 1.提示功能(在表单或者其他标签中加入tip="想提示的文字") 如: <input name="name" tip