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'; 
else if (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);