zoukankan      html  css  js  c++  java
  • Jquery插件制作经验分享 之 json字符串转换插件(附:jQuery.Json.js)

         前几天在做ecshop开发商城时,因其原使用的js框架和方法,与(我想使用的)Jquery框架有冲突,但(原js文件)其中的Ajax处理的 json对象转换的方法又是不可缺少的方法,原来的不能用,只能自己想办法写或找了,为了省事,就先网上搜索看看 ——也感觉有个东西有必要随便了解和学习下:Jquery插件的制作;对于Jquery插件有些了解,却仅仅局限于使用和概念上,对于其制作,只有个大概 的'自我'认识,但却不知道其规范制作方法。[学就学规范的,上网一查 Jquery插件制作方法的文章和帖子 还挺不少。之前还感觉挺神秘或陌生的东西,一看其中的一两篇文章,发现它: 其实很简单,规范也很清晰 易用]现将所了解到的写出来,希望对“Jquery插件制作”有兴趣的朋友 有些帮助!

    jQuery为开发插件提拱了两个方法,分别是:

    jQuery.extend(object); 为扩展jQuery类本身.为类添加新的方法。

    jQuery.fn.extend(object);给jQuery对象添加方法。

     

    虽然 javascript 没有明确的类的概念,但是用类来理解它,会更方便。

    jQuery便是一个封装得非常好的类,比如我们用 语句 $("#btn1") 会生成一个 jQuery类的实例。

     

    jQuery.extend(object); 为jQuery类添加添加类方法,可以理解为添加静态方法。如:

     

    $.extend({

      add:function(a,b){return a+b;}

    });

     

    jQuery.fn.extend(object); 对jQuery.prototype进得扩展,就是为jQuery类添加“成员函数”。jQuery类的实例可以使用这个“成员函数”。

    比如我们要开发一个插件,做一个特殊的编辑框,当它被点击时,便alert 当前编辑框里的内容。可以如下实现:

    • $.fn.extend({     
    •      
    •    alertWhileClick:function(){     
    •     
    •        $(this).click(function(){     
    •     
    •             alert($(this).val());     
    •         });     
    •      
    •     }     
    •      
    • });     
    •      
    • $("#input1").alertWhileClick(); //页面上为:<input id="input1" type="text"/>  

        最后,附上的是 从网上找的 Jquery Json插件(自己增改了一些注释),其中用到就是上面所说的方法之一:$.extend();

       方法使用如下:

    复制代码
    /**
    * @file jQuery.Json.js
    * @description 用于支持Json与其它类型互转的扩展方法
    * @author knowmore
    * @date 2011-03-01
    * @license share
    * @version 1.0.20110301
    *
    */


    /**
    * 将json字符串转换为对象的方法。
    *
    * @public
    * @param json字符串
    * @return 返回object,array,string等对象
    *
    */
    jQuery.extend({
    /** * @see 将json字符串转换为对象 * @param json字符串 * @return 返回object,array,string等对象 */
    evalJSON:
    function(strJson) {
    return eval("("+ strJson +")");
    }
    });


    /**
    * 将javascript数据类型转换为json字符串的方法。
    *
    * @public
    * @param {object} 需转换为json字符串的对象, 一般为Json 【支持object,array,string,function,number,boolean,regexp *】
    * @return 返回json字符串
    *
    */
    jQuery.extend({
    toJSONString:
    function(object) {
    var type =typeof object;
    if ('object'== type) {
    if (Array == object.constructor) type ='array';
    elseif (RegExp == object.constructor) type ='regexp';
    else type ='object';
    }
    switch (type) {
    case'undefined':
    case'unknown':
    return;
    break;
    case'function':
    case'boolean':
    case'regexp':
    return object.toString();
    break;
    case'number':
    return isFinite(object) ? object.toString() : 'null';
    break;
    case'string':
    return'"'+ object.replace(/(\\|\")/g, "\\$1").replace(/\n|\r|\t/g, function() {
    var a = arguments[0];
    return (a =='\n') ?'\\n': (a =='\r') ?'\\r': (a =='\t') ?'\\t': ""
    })
    +'"';
    break;
    case'object':
    if (object ===null) return'null';
    var results = [];
    for (var property in object) {
    var value = jQuery.toJSONString(object[property]);
    if (value !== undefined) results.push(jQuery.toJSONString(property) +':'+ value);
    }
    return'{'+ results.join(',') +'}';
    break;
    case'array':
    var results = [];
    for (var i =0; i < object.length; i++) {
    var value = jQuery.toJSONString(object[i]);
    if (value !== undefined) results.push(value);
    }
    return'['+ results.join(',') +']';
    break;
    }
    }
    });
    复制代码

    (1)toJSONString

      var goods        = new Object();
      goods.quick    = quick;
      goods.spec     = spec_arr;
      goods.goods_id = goodsId;
      goods.number   = number;
      $.post('aaaa.php?step=getPro', 'goods=' + jQuery.toJSONString(goods), getResponse, 'JSON');
     
      (2)evalJSON
        result=jQuery.evalJSON(result);
        alert(result.error);

  • 相关阅读:
    android 自动化压力测试-monkey 3 命令参数
    android 自动化压力测试-monkey 2 获取程序包名
    Mysql清空表(truncate)与删除表中数据(delete)的区别
    Ubuntu下安装Navicat+mysql的各种utf-8设置
    Python——连接MongoDB
    数据库——MongoDB
    Linux——shell脚本编程2
    Linux——shell脚本编程
    centos中创建python虚拟环境(virtualenv)
    阿里云centos7下的nginx配置
  • 原文地址:https://www.cnblogs.com/lzf0514/p/2492230.html
Copyright © 2011-2022 走看看