0

jquery プラグイン オプションに加えて、これらの値を html5 データ属性でオーバーライドしたいと考えています。

これは、オプションの目的の形式です。

var defaults = {
   text: {
      color: 'red',
      opacity: 0.5
   },
   button: {
      width: 100,
      height: 30
   }
}

データ属性を次のようにフォーマットしたかったのです。

<div data-text="color:'red', opacity: 0.5"></div>

...しかし、このデータo.text.colorは単に存在しないため、読み取ることはできません。ただし、内部にはデータがありますo.text。

で値をフェッチできるように、データ属性をフォーマットするにはどうすればよいo.text.colorですか?

4

2 に答える 2

2

json 文字列のようにフォーマットされたオブジェクトを属性に渡すだけで、jQuery データがそれを解析します。

<div class="test" data-test='{ "test1":"Lorem","test2":"Ipsum" }'></div>

更新されたフィドルも参照してください

于 2012-04-05T18:46:35.090 に答える
0

これはあまりきれいではなく、HTML の onclick イベントを思い出させます。それらを data-test1="Lorem" と data-test2="Ipsum" に分けてみませんか?

プラグインは次のようになります (jquery プラグインのボイラープレートを拡張します):

function Plugin( element, options, objD ) {
    this.element = element;
    this.options = $.extend( {}, defaults, options, objD );
    this._defaults = defaults;
    this._name = pluginName;
    this.init();
}

$.fn[pluginName] = function ( options ) {
  return this.each(function () {
    if (!$.data(this, "plugin_" + pluginName)) {
        var objD = $(this).data();
        $.data(this, "plugin_" + pluginName, new Plugin( this, options, objD ));
    }
  });
};

私は第一人者ではありませんが、私にはうまく機能します

于 2013-01-28T10:26:38.110 に答える