javascript实现相同事件名称,不同命名空间的调用方法

本文实例讲述了javascript实现相同事件名称,不同命名空间的调用方法。分享给大家供大家参考。具体实现方法如下:

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
 <title></title>
 <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
 <script src="../../scripts/jquery-1.3.1.js" type="text/javascript"></script>
 <script type="text/javascript">
 $(function(){
 $("div").bind("click",function(){
   $("body").append("<p>click事件</p>");
 });
 $("div").bind("click.plugin", function(){
   $("body").append("<p>click.plugin事件</p>");
 });
 $("button").click(function() {
   $("div").trigger("click!"); // 注意click后面的感叹号
   // click! 后面有叹号,是调用没有任何命名空间的click事件
   // click 后面没有叹号,是调用所有click事件(不管是那个命名空间的)
   // click.plugin 是调用某个特定命名空间的click事件(本例中是plugin)
 });
 })
 </script>
</head>
<body>
<div style="width:100px;height:50px;background:#888;color:white;">test.</div>
<button >根据命名空间,触发事件</button>
</body>
</html>

希望本文所述对大家的javascript程序设计有所帮助。

时间: 2015-06-23

javascript模拟命名空间

在 C++ 和 C# 中,命名空间用于尽可能地减少名称冲突.例如,在 .NET Framework 中,命名空间有助于将 Microsoft.Build.Task.Message 类与 System.Messaging.Message 区分开来.JavaScript 没有任何特定语言功能来支持命名空间,但很容易使用对象来模拟命名空间.如果要创建一个 JavaScript 库,则可以将它们包装在命名空间内,而不需要定义全局函数和类,如下所示: var MSDNMagNS = {}; MSDNMag

js关于命名空间的函数实例

本文实例讲述了js关于命名空间的函数.分享给大家供大家参考.具体如下: var MYAPP = MYAPP || {}; MYAPP.namespace = function(ns_string){ var parts = ns_string.split('.'); var parent = MYAPP; var i=0; if(parts[0]==="MYAPP"){ parts = parts.slice(1); } for(i=0 ; i<parts.length; i++

JS模块与命名空间的介绍

起因将代码组织到类中的一个重要原因是让代码更加"模块化",可以在很多不同的场景中实现代码的重用.但类不是唯一的模块化代码的方式. 一般来讲,模块是一个独立的JS文件.模块文件可以包含一个类定义.一组相关类.一个实用函数库或者一些待执行的代码. 模块化的目标是支持大规模的程序开发,处理分散源中代码的组装,并且能让代码正确运行,哪怕包含了不需要的模块代码,也可以正确执行代码. 理想状态下,所有模块都不应当定义超过一个全局标识. 模块函数通过把模块定义在某个函数的内部来实现,定义的变量和函数

JavaScript 命名空间 使用介绍

使用过Java.C#的同学对命名空间非常的熟悉,在复杂的系统中会有N多的函数.对象,语言提供的.架构预定义的,这么多的函数和对象,由于编程规范要求起有实际意义的名字,难免会重名发生错误调用,而有了命名空间烦恼就没有了,不但可以分类组织函数与对象,还可以形成隔离,解决重名问题. 使用JavaScript就没有这么舒服了,Javascript只有函数作用域,什么块儿啊.神马文件啊统统都认为是一个命名空间的,有时候因为一些重名问题导致的错误让人莫名其妙,难以调试解决. 一个简单的例子 复制代码 代码如

Javascript学习笔记之函数篇(六) : &#65279;作用域与命名空间

在之前的介绍中,我们已经知道 Javascript 没有块级作用,只有函数级作用域. 复制代码 代码如下: function test() { // a scope     for(var i = 0; i < 10; i++) { // not a scope         // count     }     console.log(i); // 10 } Javascript 中也没有显示的命名空间,这就意味着一切都定义在全局作用域中.每一次引用一个变量时,Javascript 会往上遍

Javascript 命名空间模式

然而,在不同的文件中给一个命名空间添加属性的时候,首先要保证这个命名空间是已经存在的,同时不对已有的命名空间造成任何破坏.可以通过非破坏性的命名空间函数实现: 复制代码 代码如下: var KUI = KUI || {};KUI.utils = KUI.utils || {}; KUI.utils.namespace = function(ns){    var parts = ns.split("."),        object = KUI,        i, len; if(

javascript简单实现命名空间效果

Javascript原生并不支持命名空间,需要变通来实现. 在我们创建一个JavaScript库时,命名空间就显得举足轻重了,我们可以将组成这个JavaScript库的零散的JavaScript文件(*.js)封装在命名空间中,而无须定义全局的函数或类.比如在本章节多次出现的Person,我们就可以作为库的一部分封装到合适的命名空间中: Code 5-13: 复制代码 代码如下: var com = {};com.anyjava = {};com.anyjava.Person = functio

namespace.js Javascript的命名空间库

github:https://github.com/hirokidaichi/namespace-js 定义Namespace对象: var Namespace 现在来具体看一下Namespace对象的定义,它是一个NamespaceDefinition对象.该对象是一个函数对象(NamespaceDefinition对象的构造函数,如果不给参数的话就默认生成一个main的命名空间),还有三个属性,Object,Definition,Proc.其值依次为NamespaceObjectFactor

关于JavaScript命名空间的一些心得

最近重构东西,碰到命名空间的设定,搜了一些知识,请教了一些高手,把自己的心得写下来相信大家都知道,window是顶级的,这里就不写window了,先忽略 1:关于顶级 复制代码 代码如下: var ns = ns || {}; 可以看到,其实就是如果发现没有这个对象,就自动创建new Object();如果有,就直接使用这个对象,这样就不会覆盖.2: 第二级,当然也可以在顶级的ns下创建第二级,即 复制代码 代码如下: ns.ModuleClass = {}; 可以看到,在ns下创建了一个类,当

JavaScript创建命名空间的5种写法

在JavaScript中全局变量经常会引起命名冲突,甚至有时侯重写变量也不是按照你想像中的顺序来的,可以看看下面的例子: 复制代码 代码如下: var sayHello = function() {   return 'Hello var'; }; function sayHello(name) {   return 'Hello function'; }; sayHello(); 最终的输出为 复制代码 代码如下: > "Hello var" 为什么会这样,根据 StackOv

js命名空间写法示例

本文实例分析了js命名空间写法.分享给大家供大家参考,具体如下: 很早知道这种写法,由于基础面向对象不够扎实一直在回避,但是面对整站这种方法还是有必要会 html部分: <div id="div1">111</div> <div id="div2">现实</div> <div id="div3">层</div> <div class="tab">

ES6下React组件的写法示例代码

本文主要跟大家分享了ES6下React组件的写法示例,下面来一起看看详细的介绍: 一:定义React组件 class Hello extends React.Component { render() { return <h1>Hello, {this.props.value}</h1>; } } 二:声明prop类型与默认prop class Hello extends React.Component { // ... } Hello.propTypes = { value: Re

javaScript中封装的各种写法示例(推荐)

前言 在javascript的世界里,写法是个神奇的现象,真是百家齐开放啊!每次看到老外写的js组件,思想和写法都怪异,就没看到一个js结构基本相同的代码出来.今天,我就来谈谈js写法,我在开发过程中,也写了几种.对于性能方面,如果代码结构或逻辑写的不好,会造成计算机CPU的运算加大,运行性能降低,js的写法对性能的影响也是至关重要的. 通常写js组件开发的,都会用到匿名函数的写法去封装一个对象,与外界形成一个闭包的作用域.(这里对于js的继承,多态,我就不多说了,高级程序员应该具备这些知识,如

Jtable和JTree的写法示例代码

我们首先看看Jtable和JTree的基本概念和常用构造方法. 一:表格(JTable): 1.基本概念: 表格(JTable)是Swing新增加的组件,主要是为了将数据以表格的形式显示.给显示大块数据提供了简单的机制. 2.常用构造方法: * JTable():使用系统默认的模型创建一个JTable 实例. * JTable(int numRows,int numColumns):创建一个使用DefaultTableModel 指定行.列的空表格. * JTable(Object[ ][ ]

Yii2.0中使用js异步删除示例

整理文档,搜刮出一个Yii2.0中使用js异步删除示例,稍微整理精简一下做下分享. 控制器: public function actionWeixinnotificationdel() { $model = WxDistributorNotification::findOne($_GET['id']); if ($model) { if($model->delete()) { echo 1; Yii::$app->end(); } } echo 0; Yii::$app->end();

JS事件添加和移出的兼容写法示例

本文实例讲述了JS事件添加和移出的兼容写法.分享给大家供大家参考,具体如下: var EventUtil = { addHandler : function (element , type, handler { if ( element.addEventListener){ element.addEventListener(type, handler, false); }else if ( element.attachEvent) { element.attachEvent("on"+

JS创建对象的写法示例

本文实例讲述了JS创建对象的写法.分享给大家供大家参考,具体如下: 写法1: <script> var database = function () { function add(){ console.info("add"); } function queryAll(){ console.info("queryAll"); } /** 带参数 */ function delById(id){ console.info("delById:&quo

js基本ajax写法示例代码

复制代码 代码如下: var xmlhttp = null; function myajax() { //1.创建XMLHttpRequest对象 //2.需要针对IE和其它浏览器建立这个对象的不同方式写不同的代码 if (window.XMLHttpRequest) { //针对FF,Mozilar,Opera,Safari,IE7,IE8 xmlhttp = new XMLHttpRequest(); //修正某些浏览器bug if (xmlhttp.overrideMimeType) {

js模仿jquery的写法示例代码

测试代码: 复制代码 代码如下: (function(){ var p=new PEvent(document); p.click(function() { //alert("单击"); //alert(p.style); var html=""; for ( var item in document) { html+=item+':'+document[item]+"\r\n"; } //alert(html); }); p.dblclick(

vue.js表格分页示例

分页一般和表格一起用,分页链接作为表格的一部分,将分页链接封装成一个独立的组件,然后作为子组件嵌入到表格组件中,这样比较合理. 效果: 代码: 1.注册一个组件 js Vue.component('pagination',{ template:'#paginationTpl', replace:true, props:['cur','all','pageNum'], methods:{ //页码点击事件 btnClick: function(index){ if(index != this.cu