`

jQuery form表单插件

阅读更多

back>>

http://www.cnblogs.com/wzmaodong/archive/2009/03/03/1402635.html

使用示例:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title>form表单插件</title>
    <script type="text/javascript" 
            src="js/jquery.form.js">
    </script>
    <style type="text/css">
           body{font-size:13px}
           .divFrame{width:260px;border:solid 1px #666}
           .divFrame .divTitle{padding:5px;background-color:#eee;font-weight:bold}
           .divFrame .divContent{padding:8px;line-height:1.6em}
           .divFrame .divBtn,#divData{padding-bottom:8px;padding-left:8px}
           .txt{border:#666 1px solid;padding:2px;width:150px;margin-right:3px}
           .btn {border:#666 1px solid;padding:2px;width:80px;
           filter: progid:DXImageTransform.Microsoft.Gradient(GradientType=0,StartColorStr=#ffffff, EndColorStr=#ECE9D8);}
    </style>
    <script type="text/javascript">
        $(function() {
        //定义一个表单提交时的对象
        var options = {
             url:"Login.aspx", //默认为form中的action,设置后便覆盖默认值
             target: "#divData" //将服务器返回的数据显示在Id号为divData元素中
            }
            $("#frmUserInfo").ajaxForm(options);//以Ajax的方式提交表单
        })
    </script>
</head>
<body>
     <form id="frmUserInfo" method="get" action="#">
     <div class="divFrame">
         <div class="divTitle">
              用户登录
         </div>
         <div class="divContent">
              <div>
              用户名:
              <input id="username" name="username" 
                     type="text" class="txt" />
              </div>
              <div>
              密码:
              <input id="userpass" name="userpass" 
                     type="password" class="txt" />
              </div>
         </div>
         <div class="divBtn">
              <input id="sbtUser" type="submit" 
                     value="提交" class="btn" />
         </div>
         <div id="divData"></div>
     </div>
     </form>
</body>
</html>
分享到:
评论

相关推荐

Global site tag (gtag.js) - Google Analytics