jquery自定义组件开发
jquery的组件已经有很多,但是有可能找不到符合我们需求的组件,所以我们可以动手自己封装一个jquery组件。
第一步要知道封装jquery组件的基本语法
(function ($) {
$.fn.ziDinYiZuJian = function () {
//ziDinYiZuJian 组件 要实现的功能代码
}
})(jQuery)
第二步调用自定义的组件
调用组件必须要引入在组件中用到的js包,然后调用
<div id="dom"></div>
$('#dom').ziDinYiZuJian();
注意有可能会报错:$(...).ziDinYiZuJian is not a function.
原因可能是 引入必要的js包的顺序有问题,如果是在子页面调用组件 如果母版页引入了相同js包可能会因为重复引用js包报错,所以最好把母版页的js包 都在页面一开始全引入
在封装自定义jquery组件的时候需要注意的细节问题:
1、组件的数据源只需要是具有某个特征的数据集就可以了
2、组件自己根据传入的控制参数相应的格式化数据
3、暴露出的事件所需要的参数一般是 对象+触发事件的对象
4、组件要尽量封装成可重用的组件
5、组件写好之后要整理一个组件使用文档(包括:需要传入的参数说明、暴露出来的事件、使用事例等等)
jquery自定义组件开发的更多相关文章
- Flex自定义组件开发之日周月日期选择日历控件
原文:Flex自定义组件开发之日周月日期选择日历控件 使用过DateField的我们都知道,DateField 控件是用于显示日期的文本字段,字段右侧带有日历图标.当用户在控件边框内的 ...
- 在Vue前端项目中,附件展示的自定义组件开发
在Vue前端界面中,自定义组件很重要,也很方便,我们一般是把一些通用的界面模块进行拆分,创建自己的自定义组件,这样操作可以大大降低页面的代码量,以及提高功能模块的开发效率,本篇随笔继续介绍在Vue&a ...
- 自定义组件开发:使用v-model封装el-pagination组件
1.前言 通过封装el-pagination组件开发自定义分页组件的类似文章网上已经有很多了,但看了一圈,总是不如意,于是决定还是自己动手搞一个. 2.背景 2.1.常规分页处理方法 利用el-pag ...
- jQuery自定义组件——输入框设置默认提示文字
if (window.jQuery || window.Zepto) { /** * 设置输入框提示信息 * @param options * @author rubekid */ var setIn ...
- Flex自定义组件开发 - jackyWHJ
一般情况下需要组件重写都是由于以下2个原因: 1.在FLEX已有组件无法满足业务需求,或是需要更改其可视化外观等特性时,直接进行继承扩展. 2.为了模块化设计或进一步重用,需要对FLEX组件进行组合. ...
- Flex自定义组件开发
一般情况下需要组件重写都是由于以下2个原因:1.在FLEX已有组件无法满足业务需求,或是需要更改其可视化外观等特性时,直接进行继承扩展.2.为了模块化设计或进一步重用,需要对FLEX组件进行组合.而F ...
- React jQuery公用组件开发模式及实现
目前较为流行的react确实有很多优点,例如虚拟dom,单向数据流状态机的思想.还有可复用组件化的思想等等.加上搭配jsx语法和es6,适应之后开发确实快捷很多,值得大家去一试.其实组件化的思想一直在 ...
- 使用vue的extend自定义组件开发
index.js import Vue from 'vue' import tip from './tip.vue' const Constructor = Vue.extend(tip); cons ...
- 微信小程序自定义组件实现
官方从 1.6.3 开始对于自定义组件这一块有了比较大的变动,首先比较明显的感觉就是文档比以前全多了,有木有!,现在小程序支持简洁的组件化编程,可以将页面内的功能模块抽象成自定义组件,以便在不同的页面 ...
随机推荐
- HDU4080Stammering Aliens(后缀数组+二分)
However, all efforts to decode their messages have failed so far because, as luck would have it, the ...
- HBASE---shangxueT
- 解决 sublime text3 运行python文件无法input的问题
怎么输入都没有用,原来需要配置可交互环境来运行 首先,Ctrl+Shift+p快捷键,弹出框框输入 install Package,回车后又弹出一个框,输入SublimeREPL(要安装的插件名字), ...
- MySQL_产品昨日库存与历史入库历史出库成本_20161124
产品昨日库存与历史入库历史出库成本 SELECT d.ID,a.*,e.昨日订单额 ,b.昨天入库额,b.历史2天,b.历史3天,b.历史4天,b.历史5天,b.历史6天,b.历史7天,b.历史8天, ...
- 数据结构与算法(4)----->链表、二分搜索
1. 链表的基本概念 链表和数组一样都是一种线性结构; 数组是一段连续的存储空间; 链表空间不一定保证连续,是临时分配的; 链表的分类 按方向: 单链表:每个节点只能通过next指针指向下一个节点; ...
- 二维数组是二级指针pointer to pointer!
二维数组居然是个类似于二级指针(pointer to pointer)的东西,十分震惊! #include <stdio.h> int main() { ][]={{,,,},{,,,}, ...
- linux 下定位程序假死
ps -ef | grep 程序名称 pstack 程序的进程ID
- CLR via C# 第五章学习记录(更新中)
1.设置全局溢出检查,项目属性->生成->高级->检测运算上溢/下溢 2.局部使用溢出检测 Byte b = ; b = ));// 不检测溢出 checked// 检测溢出代码段 ...
- Swoole HTTP 的应用
目录 概述 代码 小结 扩展 概述 这是关于 Swoole 学习的第四篇文章:Swoole HTTP 的应用. 第三篇:Swoole WebSocket 的应用 第二篇:Swoole Task 的应用 ...
- CSS 定位 (Positioning)概述
div.h1 或 p 元素常常被称为块级元素. 这意味着这些元素显示为一块内容,即“块框”. 与之相反,span 和 strong 等元素称为“行内元素”,这是因为它们的内容显示在行中,即“行内框”. ...