jQuery val () Methode auf einem benutzerdefinierten Objekt

Question

Ich habe ein Objekt namens ValueBox, dass ich so erstellt:

function ValueBox(params) {
   ...
   $.extend(true, this, $('/* some HTML elements */'));
   ...
   var $inputBox = $('input[type=text]', this);
   ...
   this.val = function(newValue) {
      if(typeof newValue == "number") {
         $inputBox.val(newValue);
         $inputBox.change();
      } else {
         return parseFloat($inputBox.val());
      }
   }
}

Ich habe ein Änderungsereignis auf einer bestimmte ValueBox Instanz, die immer dann, wenn die $inputBox Änderungen feuert, aber die Änderung Callback-Funktion ist nicht in der Lage, die val () -Methode in meiner Klasse zu verwenden. Ich gehe davon aus, dass $(this).val() unter Verwendung, dass ich die jQuery val () -Methode bin Aufruf, was natürlich nicht funktionieren würde. Ist es möglich, die val () Methode für den Zugriff auf den I definiert?

Answer 1

Wenn Sie $inputBox.change() aufrufen, übergeben sie die ValueBox Objekt. Dann ruft val darauf. Auf diese Weise werden Sie sich keine Sorgen machen müssen über Probleme innerhalb jQuery Kontrollen Scoping.

Answer 2

$.fn.yourpluginscope.originalVal = $.fn.val;
$.fn.extend({
    val: function (value) {
        if (/* detect your plugin element */)
        {
            if (value == undefined)
                return /* getter */;
            return $.fn.yourpluginscope.originalVal.call(/* setter */, value);
        }
        return $.fn.yourpluginscope.originalVal.call(this, value);
    }
});

Die richtige Art und Weise zu sich "native" jQuery-Methode

Answer 3

Wenn Sie wirklich interessiert sind bei der Verlängerung val () für Ihr Plugin, können Sie so etwas wie die folgenden versuchen:

Nehmen wir an, Sie eingestellt haben und das Attribut „Wert“ in dem äußersten Element Ihres Plugins.

jQuery.fn.extend({ val: function(newValue) {
    if (newValue == null) {
        return $(this).attr("value");
    } else {
        $(this).attr("value", newValue);        
    }
} 
});

Wenn die ID meiner Plugin-Instanz ist myValueBox dann würde ich in der Lage sein, auf die folgende Weise zu verwenden val:

$ ( "# myValueBox"). Val ()

Es funktionierte für mich, aber ich bin nicht sicher, ob es Ihren Anforderungen entspricht.

Answer 4

ich glaube, Sie etwas wie die

versuchen sollten,

function ValueBox(params) {
   ...
   $.extend(true, this, $('/* some HTML elements */'));
   ...
   this.inputBox = $('input[type=text]', this);
   ...
}

ValueBox.prototype.val = function(newValue) {
    if(typeof newValue == "number") {
        this.inputBox.val(newValue);
        this.inputBox.change();
    } else {
        return parseFloat(this.inputBox.val());
    }
};

// then this should work
var test = new ValueBox();
test.val(123);

Im Prototyp Sie öffentliche Methoden definieren, alles, was in ValueBox Funktion ist privat;