軽量なウィジェットを作成しようとしているJQueryとオブジェクト

Question

ジェネリックを選択して "コントロール"を選択しようとすると、要素を動的に追加できますが、機能が正しく機能するようになっています。

これは私が始めたものです。

$select = $("<select></select>"); 
$select.addOption = function(value,text){ 
    $(this).append($("<option></option>").val(value).text(text)); 
}; 

はこれだけではうまくいきましたが、いつでも$selectは「.clone(true)あるaddOption()機能が失われる編。

これは私のオブジェクトアプローチですが、それでも機能は動作しません。

function $selectX() { 
    return $("<select></select>"); 
} 

$selectX.prototype.addOption() = function(value,text){ 
    $(this).append($("<option></option>").val(value).text(text)); 
}; 

ハックソリューションは、作成後に手動で機能を追加することです：

$nameSelect= new $selectX; 
$nameSelect.addOption = function(value,text){ 
    $(this).append($("<option></option>").val(value).text(text)); 
}; 

は私が間違ってツリーを吠えていますか？

Answer 1

この場合には、それはなりますので、あなたがjQuery.fn.methodName属性を使用する必要がjQueryのに新しいメソッドを追加するには：

jQuery.fn.addOption = function (value, text) { 
    jQuery(this).append(jQuery('<option></option>').val(value).text(text)); 
}; 

しかし、これaddOptionがどの$()呼び出しの結果からアクセス可能になることに注意してください。

Answer 2

下のリンクには、自動的にウィジェットを作成するプラグインのサンプルコードがあります。必要に応じてカスタマイズすることができます。

http://sites.google.com/site/spyderhoodcommunity/tech-stuff/jquerydashboardwidgetplugin