Jquery Easyui表单组件Form使用详解(30)


Posted in Javascript onDecember 19, 2016

本文实例为大家分享了Jquery Easyui表单组件的实现代码,供大家参考,具体内容如下

加载方式

表单组件只能在 JS 区域设置,首先定义一张表单。

<form id="box" method="post">
    <div>
      <label for="name">Name:</label>
      <input class="easyui-validatebox" type="text" name="name"
          data-options="required:true" />
    </div>
    <div>
      <label for="email">Email:</label>
      <input class="easyui-validatebox" type="text" name="email"
          data-options="validType:'email'" />
    </div>
    <input type="submit">
  </form>
  <script>
    $(function () {
      //JS 加载调用
      $('#box').form({
        url : 'content.php',
        onSubmit: function(){
        },
        success:function(data){
          alert(data);
        }
      });
    });
  </script>

属性列表

Jquery Easyui表单组件Form使用详解(30)

//属性设置
$('#box').form({
  url : 'content.php',
});

事件列表

Jquery Easyui表单组件Form使用详解(30)

<script>
    $(function () {
      //JS 加载调用
      $('#box').form({
        url : 'content.php',
        onSubmit: function(){
        },
        success:function(data){
          alert(data);
        },
        onBeforeLoad : function () {
          alert('load 之前执行');
        },
        onLoadSuccess : function (data) {
          alert('load 成功后执行:' + data.name);
        },
        onLoadError : function () {
          alert('load 错误时执行');
        },
      });
    });
  </script>

方法列表

Jquery Easyui表单组件Form使用详解(30)

//自动提交
      $('#box').form('submit', {

      });
      //使用 load 填充
      $('#box').form('load', {
        name : 'bnbbs',
        email : 'bnbbs@163.com',
      });
      //使用 load 通过 URL 填充,对方是 JSON 格式
      $('#box').form('load', 'content.php');
      //验证后再执行提交
      $('#box').form({
        url : 'content.php',
        onSubmit : function (param) {
          return $(this).form('validate');
        },
        success : function (data) {
          alert(data);
        },
      });
      //清理和重置
      $('#box').form('clear');
      $('#box').form('reset');
      //禁用和启用验证
      $('#box').form('disableValidation');
      $('#box').form('enableValidation');
      //使用$.fn.form.defaults 重写默认值对象。

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
js loading加载效果实现代码
Nov 24 Javascript
JavaScript 学习笔记(六)
Dec 31 Javascript
JS 文件传参及处理技巧分析
May 13 Javascript
Jquery EasyUI中弹出确认对话框以及加载效果示例代码
Feb 13 Javascript
JavaScript中双叹号(!!)作用示例介绍
Apr 10 Javascript
jquery实现的3D旋转木马特效代码分享
Aug 25 Javascript
js实现短信发送倒计时功能(正则验证)
Feb 10 Javascript
AngularJS中控制器函数的定义与使用方法示例
Oct 10 Javascript
微信小程序使用swiper组件实现类3D轮播图
Aug 29 Javascript
React路由鉴权的实现方法
Sep 05 Javascript
vue-resourc发起异步请求的方法
Feb 11 Javascript
JavaScript实现矩形块大小任意缩放
Aug 25 Javascript
基于JavaScript实现自动更新倒计时效果
Dec 19 #Javascript
Bootstrap的基本应用要点浅析
Dec 19 #Javascript
详解javascript获取url信息的常见方法
Dec 19 #Javascript
js封装tab标签页实例分享
Dec 19 #Javascript
jQuery焦点图轮播效果实现方法
Dec 19 #Javascript
JS实现焦点图轮播效果的方法详解
Dec 19 #Javascript
jQuery拖拽通过八个点改变div大小
Nov 29 #Javascript
You might like
采集邮箱的php代码(抓取网页中的邮箱地址)
2012/07/17 PHP
关于使用key/value数据库redis和TTSERVER的心得体会
2013/06/28 PHP
php防止sql注入代码实例
2013/12/18 PHP
两款万能的php分页类
2015/11/12 PHP
php+redis实现商城秒杀功能
2020/11/19 PHP
PHP SPL 被遗落的宝石【SPL应用浅析】
2018/04/20 PHP
jQuery AJAX 调用WebService实现代码
2010/03/24 Javascript
网页实时显示服务器时间和javscript自运行时钟
2014/06/09 Javascript
jQuery实现响应浏览器缩放大小并改变背景颜色
2014/10/31 Javascript
简介JavaScript中setUTCSeconds()方法的使用
2015/06/12 Javascript
nodejs导出excel的方法
2015/06/30 NodeJs
jQuery 中ajax异步调用的四种方式
2016/06/28 Javascript
javascript特殊文本输入框网页特效
2016/09/13 Javascript
BootStrap入门教程(二)之固定的内置样式
2016/09/19 Javascript
jquery实现图片轮播器
2017/05/23 jQuery
js下拉菜单生成器dropMenu使用方法详解
2017/08/01 Javascript
利用JS如何计算字符串所占字节数示例代码
2017/09/13 Javascript
node.js通过axios实现网络请求的方法
2018/03/05 Javascript
微信小程序左滑动显示菜单功能的实现
2018/06/14 Javascript
Vue入门学习笔记【基本概念、对象、过滤器、指令等】
2019/04/13 Javascript
vue学习笔记之过滤器的基本使用方法实例分析
2020/02/01 Javascript
TypeScript 运行时类型检查补充工具
2020/09/28 Javascript
Python OpenCV利用笔记本摄像头实现人脸检测
2020/08/20 Python
用scikit-learn和pandas学习线性回归的方法
2019/06/21 Python
python多线程使用方法实例详解
2019/12/30 Python
css3的focus-within选择器的使用
2020/05/11 HTML / CSS
香港No.1得奖零食网:香港零食大王
2016/07/22 全球购物
中学教师培训制度
2014/01/31 职场文书
感恩母亲节活动方案
2014/03/04 职场文书
小学一年级学生评语
2014/04/22 职场文书
环保建议书200字
2014/05/14 职场文书
普通党员自我剖析材料
2014/10/07 职场文书
鲁滨逊漂流记读书笔记
2015/06/26 职场文书
《乌鸦喝水》教学反思
2016/02/19 职场文书
创业计划书之熟食店
2019/10/16 职场文书
python爬虫请求库httpx和parsel解析库的使用测评
2021/05/10 Python