`

js...对象..

    博客分类:
  • js
js 
阅读更多
js对象:(面向对象的思路)
首先,关于js对象的创建有几种需要注意的地方:
     (1)定义函数就是创建对象的方式:
          testS=function(){//公有方法和属性
this.fun=function(confirmId,titleCon,tipContent){},
this.success=function(msg){},
this.error=function(msg){}}
    (2)prototype扩展属性:两种方式
       第一,testS.prototype.fun=function(){};//注意加分号
      第二,testS.prototype = { fun:function(confirmId,titleCon,tipContent){};}
其次,js创建弹出对话框的插件:
     借助ui.dialog(jquery-ui-1.8.18.custom.min.js),是用该插件主要思路是定义显示的对话框,初始化对话框(自动弹出还是open触发,标题,按钮等)
      主要的思路是定义一个对象,对象里的方法是拼对话框的html,然后追加到form元素后面,并隐藏,然后调用open函数,然后new一个对象,调用属性方法。
<1>在对象里
testS=function(){
this.fun=function(confirmId,titleCon,tipContent){
var htmlStr='<div id="'+confirmId+'" title="'+confirmId
    +'" style="display: none">'
    +'<p><span class="ui-icon ui-icon-alert"
      style="float: left;  margin: 0 7px 20px 0;"></span><div>'
    +tipContent+'</div></p></div>';
$('form').append(htmlStr);
$("#"+confirmId).dialog({
    autoOpen:false,
  bgiframe: true,
  title:titleCon,
  modal: true,
  buttons: {
      '确定':function() {
    $(this).dialog('close');
         }
       }
  });
$("#"+confirmId).dialog('open');

},
this.success=function(msg){
this.fun("success-confirm","成功",msg);
},
this.error=function(msg){
this.fun("fail-confirm","失败",msg);
}
}
testS=new testS();

<2>扩展
testS=function(){}
testS.prototype = {
fun:function(confirmId,titleCon,tipContent){
var htmlStr='<div id="'+confirmId+'" title="'+confirmId+'" style="display: none">
+'<p><span class="ui-icon ui-icon-alert" style="float: left; margin: 0 7px 20px 0;"></span><div>'
+tipContent+'</div></p></div>';
$('form').append(htmlStr);
$("#"+confirmId).dialog({
    autoOpen:false,
  bgiframe: true,
  title:titleCon,
  modal: true,
  buttons: {
      '确定':function() {
    $(this).dialog('close');
         }
       }
  });
$("#"+confirmId).dialog('open');

},
success:function(msg){
testS.fun("success-confirm","成功",msg);
},
error:function(msg){
testS.fun("fail-confirm","失败",msg);
}
}

testS=new testS();


<3>扩展:
testS=function(){}

testS.prototype.fun=function(confirmId,titleCon,tipContent){
var htmlStr='<div id="'+confirmId+'" title="'+confirmId+'" style="display: none">'
+'<p><span class="ui-icon ui-icon-alert" style="float: left; margin: 0 7px 20px 0;"></span><div>'
+tipContent+'</div></p></div>';
$('form').append(htmlStr);
$("#"+confirmId).dialog({
    autoOpen:false,
  bgiframe: true,
  title:titleCon,
  modal: true,
  buttons: {
      '确定':function() {
    $(this).dialog('close');
         }
       }
  });
$("#"+confirmId).dialog('open');
};
testS.prototype.error=function(msg){
testS.fun("fail-confirm","失败",msg);
};
        
分享到:
评论

相关推荐

    第8节 JavaScript对象.rar

    第8节 JavaScript对象.rar第8节 JavaScript对象.rar第8节 JavaScript对象.rar第8节 JavaScript对象.rar第8节 JavaScript对象.rar第8节 JavaScript对象.rar第8节 JavaScript对象.rar第8节 JavaScript对象.rar第8节 ...

    第10节 JavaScript内置对象.rar

    第10节 JavaScript内置对象.rar第10节 JavaScript内置对象.rar第10节 JavaScript内置对象.rar第10节 JavaScript内置对象.rar第10节 JavaScript内置对象.rar第10节 JavaScript内置对象.rar第10节 JavaScript内置对象....

    5.js.对象.rar

    对象.rar"这个压缩包文件显然包含了与JavaScript对象相关的学习资源,对于想要深入理解前端开发的初学者或进阶者都非常有价值。JavaScript对象是语言的基石之一,它们是键值对的集合,可以用来组织和操作数据。 1. ...

    JS.Class 2.1发布 Ruby风格的JavaScript.zip

    总结起来,JS.Class 2.1提供了Ruby风格的JavaScript编程,让开发者能够以更面向对象的方式处理JavaScript代码,同时保持了JavaScript的灵活性。其类定义、模块化、方法区分以及与jQuery的结合使用,使得JavaScript...

    纯前端下载FileSaver.js.rar

    FileSaver.js是一个轻量级的JavaScript库,它允许在浏览器环境中实现文件的本地保存功能,无需服务器端的任何干预。这个压缩包"纯前端下载FileSaver.js.rar"包含的就是这个库的核心文件。 FileSaver.js是基于HTML5...

    BigDecimal.js.zip

    总之,BigDecimal.js是一个强大的JavaScript库,专门用于处理大数的高精度计算,通过引入"BigDecimal-all-last.min.js",开发者可以获得精确的大数运算能力,从而避免JavaScript原生数据类型的精度问题。在开发过程...

    前端项目-decimal.js.zip

    为了使用,你需要在JavaScript代码中先引用decimal.js,然后就可以创建和操作Decimal对象了。例如: ```javascript var Decimal = require('decimal.js'); // 如果在Node.js环境中 // 或者在浏览器中通过标签引入 ...

    org.mozilla.javascript-1.7.2.jar

    通过`ScriptableObject`,可以实现JavaScript与Java对象的互操作,使得JavaScript能够调用Java方法,访问Java对象。 然而,值得注意的是,尽管Rhino在某些场景下表现出色,但它对最新版本的JavaScript支持并不完全...

    Javascript面向对象编程.

    面向对象编程(Object-Oriented Programming,OOP)是编程的一种重要范式,JavaScript也完全支持这一特性,尽管它并非一种传统的静态类型语言。这篇博客文章可能详细讨论了如何在JavaScript中实现面向对象编程。 在...

    vue.global.js,Vue.js 框架的核心文件之一

    它包含了 Vue.js 全局对象的定义和一些全局方法和属性的实现。 该文件对整个 Vue.js 应用的运行起着重要的作用,它提供了全局范围的 Vue 构造函数和一些全局方法。例如,你可以使用这个文件来创建全局的 Vue 实例,...

    面向对象的javascript框架modulejs.zip

    modulejs是极致模块化的且面向对象的javascript框架,modulejs能让你在简单易用的前提下写出更佳维护性和可重用性的javascript代码。 标签:modulejs 分享 ...

    three.js.master

    《Three.js开发指南:WebGL的JavaScript 3D库》 在Web开发领域,Three.js是一个备受推崇的JavaScript库,专为实现WebGL技术而设计,用于在浏览器中创建交互式的3D图形。WebGL是一种基于OpenGL标准的JavaScript API...

    前端项目-fabric.js.zip

    【前端项目-fabric.js.zip】是一个包含前端开发中使用的JavaScript库——Fabric.js的源代码压缩包。Fabric.js是一个强大的HTML5 canvas库,它为开发者提供了一个面向对象的模型,使得在canvas上操作图形变得简单易行...

    deePool高效的JavaScript对象池

    DeePool通过实现JavaScript对象池,为开发者提供了一种优化内存使用、提高程序运行效率的有效手段。尤其在需要大量创建和销毁对象的场景下,使用DeePool可以显著提升性能,减少内存压力。掌握并合理运用DeePool,...

    document 对象.html-javascript中DOM对象内容

    document 对象.html-javascript中DOM对象内容

    react.js、react-dom.js、babel.js文件包下载

    **react-dom.js** 是React库的一个子模块,专门用于与DOM(浏览器中的文档对象模型)交互。当你在浏览器环境中使用React时,需要引入react-dom来将React组件渲染到页面的实际DOM节点上。例如,`ReactDOM.render()`...

    JS.Class 学习笔记

    在JavaScript的世界里,JS.Class库提供了一种面向对象编程的机制,模仿了Ruby中的模块(Module)和类(Class)的概念。这篇学习笔记主要探讨了JS.Class如何利用JS.Module实现继承、方法查找以及模块的使用。 JS....

    Javascript面向对象扩展库(lang.js)

    `lang.js`是一个针对JavaScript的面向对象扩展库,专门为了弥补原生JavaScript在面向对象编程上的不足而设计。 `lang.js`库引入了类的概念,使得JavaScript可以更像传统的面向对象语言那样进行开发。在JavaScript中...

    pdf.js和pdf.worker.js html打开pdf所需要的js

    3. **Web Worker集成**:为了使用PDF.Worker.js,开发者需要在初始化时指定worker路径,并创建一个新的PDFWorker对象。这样,PDF解析的工作就会在Worker线程中进行,提高页面性能。 4. **事件监听**:PDF.js提供了...

    d3.min.js d3.js

    D3.js,全名Data-Driven Documents,是一个强大的JavaScript库,专用于数据可视化。这个库由Mike Bostock创建,其核心理念是让开发者能够直接操作DOM(文档对象模型)来绑定数据,并根据数据的变化自动更新视图。D3....

Global site tag (gtag.js) - Google Analytics