1

我正在完成编写一个 javascript 组件,我想提供一堆示例来说明配置属性、事件、方法等......

我目前有以下 HTML 来记录单个属性:

      <div class="conf">
        <div class="opt-name">allowFreeEntries</div>
        <code>boolean</code>
        <div style="clear:both;"></div>
        <div class="opt-desc">Restricts or allows the user to validate typed entries.<br/>Defaults to <em>true</em>
            <a class="opt-ex">View an example</a>
            <span class="hidden">{"allowFreeEntries": false}</span>
        </div>
      </div>

单击“查看示例”链接时,我会弹出另一个 div,其中包含我的组件,其默认配置与隐藏跨度中给出的自定义配置混合在一起:

$('.conf .opt-ex').click(function(){
    var raw = $(this).next().html();
    var rawCfg = JSON.parse(raw);
    var exId = 'example-' + $('div[id^="example-"]').length + 1;
    var cfg = $.extend({
        renderTo: $('#' + exId),
        width: 590
    }, rawCfg);
    $('<div/>',{id: exId}).insertBefore(this);
    new MyComponent(cfg);
});

这一切都很顺利......这是棘手的部分。我想将完整的评估代码输出为组件上方的原始 HTML。我想向用户显示的是:

        <code><pre>
        new MagicSuggest({
            renderTo: $('#example-1'),
            width: 590,
            allowFreeEntries: false                    
        });
        </pre></code>

我做了一些实验,但它们都显得笨拙。有什么建议么?

非常感谢!

4

1 回答 1

0

据我了解,您正在尝试在新的 MagicSuggest 字符串中打印对象的值。AFAIK 你只需要使用字符串追加来追加它。要打印对象本身,您可以使用

   var printObj = typeof JSON != "undefined" ? JSON.stringify : function(obj) {
     var arr = [];
     $.each(obj, function(key, val) {
     var next = key + ": ";
     next += $.isPlainObject(val) ? printObj(val) : val;
     arr.push( next );
     });
     return "{ " +  arr.join(", ") + " }";
   };

参考:http ://api.jquery.com/jQuery.extend/

于 2013-02-14T04:49:01.900 回答