Html 5データ属性をjqueryプラグインオプション形式に変換

Question

jqueryプラグインオプションに加えて、これらの値をhtml5データ属性で上書きします。

---

これはoptionisのために所望の形式である：私はこのようなデータ属性何かフォーマットしたかった

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で値を取得できるように、データ属性をフォーマットするにはどうすればよいですか？

Answer 1

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

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

また、これは非常にきれいイマイチとHTMLでのonclickイベントのことを思い出すupdated fiddle

Answer 2

を参照してください。 data-test1 = "Lorem" & data-test2 = "Ipsum"にそれらを分けてみませんか？それは単純なものだと私はちょうど包むことができませんでした。..

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)); 
    } 
    }); 
}; 

イムなしの第一人者が、私のためによくこれは常に起こる