div - ¿Qué son jQuery valHooks?

set text jquery

Question

Después de leer sobre valHooks en un defecto de jQuery y más recientemente visto en un fiddle , busqué en la documentación de jQuery y en Google, pero no puedo encontrar nada más que un breve ejemplo en la publicación de la versión jQuery 1.6 . ¿Alguien puede explicar qué son los valHooks y por qué son útiles?

Answer 1

Es un conjunto de funciones que definen cómo obtener / establecer valores de elementos DOM.

No todos los elementos se pueden configurar utilizando .value . Por ejemplo, un elemento select requiere algo a lo largo de las líneas de select.options[select.selectedIndex].value .

El código subyacente revela, por ejemplo, cómo obtener / establecer el valor de un elemento de select :

select: {
        get: function( elem ) {
            var value,
                index = elem.selectedIndex,
                values = [],
                options = elem.options,
                one = elem.type === "select-one";

            // Nothing was selected
            if ( index < 0 ) {
                return null;
            }

            // Loop through all the selected options
            for ( var i = one ? index : 0, max = one ? index + 1 : options.length; i < max; i++ ) {
                var option = options[ i ];

                // Don''t return options that are disabled or in a disabled optgroup
                if ( option.selected && (jQuery.support.optDisabled ? !option.disabled : option.getAttribute("disabled") === null) &&
                        (!option.parentNode.disabled || !jQuery.nodeName( option.parentNode, "optgroup" )) ) {

                    // Get the specific value for the option
                    value = jQuery( option ).val();

                    // We don''t need an array for one selects
                    if ( one ) {
                        return value;
                    }

                    // Multi-Selects return an array
                    values.push( value );
                }
            }

            // Fixes Bug #2551 -- select.val() broken in IE after form.reset()
            if ( one && !values.length && options.length ) {
                return jQuery( options[ index ] ).val();
            }

            return values;
        },

        set: function( elem, value ) {
            var values = jQuery.makeArray( value );

            jQuery(elem).find("option").each(function() {
                this.selected = jQuery.inArray( jQuery(this).val(), values ) >= 0;
            });

            if ( !values.length ) {
                elem.selectedIndex = -1;
            }
            return values;
        }
    }

Answer 2

Hice un pequeño artículo con un ejemplo simple here .

$.valHooks[''myedit''] = {
    get : function(el) {
        return $(el).html();
    },
    set : function(el, val)
    {
        $(el).html(val);
    }
};

$.fn.myedit = function()
{
    this.each(function() {
        this.type = ''myedit'';
    });
    return this;
}

$(''#edit'').myedit().val('' Hi there!'');
$(''#value'').html(''The value is : '' + $(''#edit'').val());

Answer 3

valHooks le permite anular el comportamiento predeterminado de .val() para cualquier objeto accesible a jQuery.