当前位置: 首页 > 图文教程 > 网络编程 > Javascript > nicejforms:美化表单不用愁

Javascript
mvc模式分离javascript开发
30个美观的有创意的和引人注目的灵感导航菜单
JS教程:匿名函数
JS教程:childNodes与parentNode
IE浏览器的DOM模型
使用yui3实现最简单拖动
YUI的简单的dom事件
JS区别IE6、IE7、IE8之间的方法
JavaScript教程:Table行定位效果
建立HTML字符串的最快速方法
10个美观实用的jQuery和MooTool日历插件
JS教程:Javascript实现缓动效果
Javascript小游戏贪吃蛇(详细注释)
JavaScript组件开发:分析和设计组件
JavaScript:判断iframe是否加载完成的完美方法
JS特效详解:图片幻灯片切换
JS给文本区域(textarea)字数限制
用js按比例重定图片尺寸
不用组件实现Ajax效果
PHP+JS实现搜索自动提示

Javascript 中的 nicejforms:美化表单不用愁


出处:互联网   整理: 软晨网(RuanChen.com)   发布: 2009-10-12   浏览: 188 ::
收藏到网摘: n/a

nicejforms可以算是jquery的一个插件,可以起到非常好的美化表单的作用
demo:http://www.healdream.com/upload/html/nicejforms/nicejforms_green.html
down:http://www.51files.com/?O4IXTNT9ZO9BIL954XTP
用法:
首先将两个js包含进来,就像这样
复制代码 代码如下:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html;charset=utf-8" />
<title>Page title</title>
<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript" src="nicejforms.js"></script>
</head>
<body>

然后加入css
复制代码 代码如下:

<style type="text/css" media="screen">@import url("niceforms.css")</style>

接着对form,设定class
复制代码 代码如下:

<form action="vars.php" method="POST" class="niceform">

最后写下如下语句
<script type="text/javascript">
$(document).ready( function() { $.NiceJForms.build(); } );
</script>
这样就大功告成了!