使用 jQuery（中级），第 2 部分: 创建自己的插件

核心提示： 这是创建插件的最后一个步骤！这样您就有了一个不错的插件，可以进行最后的测试了，使用 jQuery（中级），第 2 部分: 创建自己的插件(10)，清单 8 展示了您可以放入本文的完整插件，以便您查看这些部分是如何变为一个整体的，第 1 部分: 使用插件创建和扩展 jQuery 函数

这是创建插件的最后一个步骤！这样您就有了一个不错的插件，可以进行最后的测试了。清单 8 展示了您可以放入本文的完整插件，以便您查看这些部分是如何变为一个整体的。此外还包含了 parse() 函数，到目前为止我还没有讨论过该函数，但是它包含在插件中（我没有详细介绍插件处理格式化的部分，因为它们不在本文讨论之列。样例中包含了该部分，插件本身当然也有）。

清单 8. NumberFormatter 插件

(function(jQuery)　{　
　
　　function　FormatData(valid,　dec,　group,　neg)　{　
　　　　this.valid　=　valid;　
　　　　this.dec　=　dec;　
　　　　this.group　=　group;　
　　　　this.neg　=　neg;　
　　};　
　
　　function　formatCodes(locale)　{　
　　　//　format　logic　goes　here　
　　　return　new　FormatData(valid,　dec,　group,　neg);　
　　};　
　
　jQuery.fn.parse　=　function(options)　{　
　
　　var　options　=　jQuery.extend({},jQuery.fn.parse.defaults,　options);　
　
　　var　formatData　=　formatCodes(options.locale.toLowerCase());　
　
　　var　valid　=　formatData.valid;　
　　var　dec　=　formatData.dec;　
　　var　group　=　formatData.group;　
　　var　neg　=　formatData.neg;　
　
　　var　array　=　[];　
　　this.each(function(){　
　
　　　　var　text　=　new　String(jQuery(this).text());　
　　　　if　(jQuery(this).is(":input"))　
　　　　　　text　=　new　String(jQuery(this).val());　
　
　
　　　　//　now　we　need　to　convert　it　into　a　number　
　　　　var　number　=　new　Number(text.replace(group,'').replace(dec,".").replace(neg,"-"));　
　　　　array.push(number);　
　　　});　
　
　　　return　array;　
　};　
　
　jQuery.fn.format　=　function(options)　{　
　
　　var　options　=　jQuery.extend({},jQuery.fn.format.defaults,　options);　　
　
　　var　formatData　=　formatCodes(options.locale.toLowerCase());　
　
　　var　valid　=　formatData.valid;　
　　var　dec　=　formatData.dec;　
　　var　group　=　formatData.group;　
　　var　neg　=　formatData.neg;　
　
　　return　this.each(function(){　
　　　　var　text　=　new　String(jQuery(this).text());　
　　　　if　(jQuery(this).is(":input"))　
　　　　　　text　=　new　String(jQuery(this).val());　
　
　　　　//　formatting　logic　goes　here　
　
　　　　if　(jQuery(this).is(":input"))　
　　　　　　jQuery(this).val(returnString);　
　　　　else　
　　　　　　jQuery(this).text(returnString);　
　　});　
　};　
　
　jQuery.fn.parse.defaults　=　{　
　　locale:　"us"　
　};　
　
　jQuery.fn.format.defaults　=　{　
　　format:　"#,###.00",　
　　locale:　"us"　
　};　
　
　})(jQuery);

编缉推荐阅读以下文章

• 使用 jQuery（中级），第 1 部分: 使用插件创建和扩展 jQuery 函数
• 使用 jQuery，第 3 部分: 用 jQuery 和 Ajax 构建富 Internet 应用程序
• 使用 jQuery，第 2 部分: 构建未来的 Web 应用程序
• 使用 jQuery，第 1 部分: 将桌面应用程序引入浏览器