javascript - jQueryとオブジェクト、軽量ウィジェットを作成しようとしています

Question

要素を動的に追加できるmakegenericselect "control"を作​​成しようとしていますが、関数を正しく機能させるのに問題があります。

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

$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 に新しいメソッドを追加するには、属性を使用する必要があるjQuery.fn.methodNameため、この場合は次のようになります。

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

ただし、これaddOptionは任意の$()呼び出しの結果からアクセスできることに注意してください。