Utilizando jQuery para superar IE Button Valor Error

Question

Issue: 7, el texto de un elemento de botón se devuelve en jQuery usando .val() o .attr ('value'), en lugar del botón real valor. Este es un problema conocido y también ocurre con Javascript directo usando .value. Hubo una discusión anterior sobre el mismo aquí:

Retrieve Button value with jQuery

sino una solución total aceptable nunca fue encontrado (sólo un corte en el texto del botón se oculta temporalmente).

He estado trabajando en una solución total para que cada vez que se acceda al valor de un botón (ya sea en el envío del formulario o simplemente usando jQuery/Javascript), se devuelva el valor correcto. Lo tengo trabajando con .val() con el siguiente código. Estoy buscando ayuda para hacerlo funcionar también con .attr ('valor'), e incluso con Javascript .value si es posible.

He creado una página jsFiddle donde puede ser visto en acción aquí:

http://jsfiddle.net/hyperseer/RVyDN/2/

Código:

$(document).ready(function(){ 

    $().iefixer(); 

}); 

(function($){ 

    $.fn.iefixer = function(){ 

      $.fn.origval = $.fn.val; 
      $.fn.val = function(value){ 
       var elem = this[0]; 
       if(value === undefined){ 
        var returnVal = null; 
        if(elem.nodeName.toLowerCase() == 'button') 
        { 
         returnVal = elem.getAttributeNode("value").nodeValue; 
        } else { 
         returnVal = $(elem).origval(); 
        } 
        return returnVal; 
       } else { 
        if(elem.nodeName.toLowerCase() == 'button') 
        { 
         elem.getAttributeNode("value").nodeValue = value; 
        } else { 
         $(elem).origval(value); 
        } 

       } 
      } 

$('button').click(function() { 

alert("$(this).val() = " + $(this).val()); // this works now with above fix 
alert("$(this).attr('value') = " + $(this).attr('value')); // doesn't work 
alert("this.value = " + this.value); // straight JS doesn't work 

      }); 

    }; 

})(jQuery); 

Answer 1

ACTUALIZACIÓN:

I Ahora lo tengo trabajando con el .val() y .attr ('value') funciona con el siguiente código:

$(document).ready(function(){ 
    $().iefixer(); 
}); 

(function($){ 

$.fn.iefixer = function(){ 

    var ie = $.browser.msie; 
    var ver = $.browser.version; 

    if (ie && ver<=7) { 

     $.fn.origval = $.fn.val; 
     $.fn.val = function(value){ 
      var elem = this[0]; 
      if(value === undefined){ 
       var returnVal = null; 
       if(elem.nodeName.toLowerCase() == 'button') 
       { 
        returnVal = elem.getAttributeNode("value").nodeValue; 
       } else { 
        returnVal = $(elem).origval(); 
       } 
       return returnVal; 
      } else { 
       if(elem.nodeName.toLowerCase() == 'button') 
       { 
        elem.getAttributeNode("value").nodeValue = value; 
       } else { 
        $(elem).origval(value); 
       } 

      } 
     } 

    var originalAttr = $.fn.attr; 
     $.fn.attr = function(name, val) { 
      if (this[0].nodeName.toLowerCase() == 'button' && val === undefined) return $(this).val(); 
      return originalAttr.apply(this, arguments);  
     } 

    }  

}; 

})(jQuery); 

Answer 2

Una mejora a Al. código, con el fin de realizar la función attr() trabajar con más valor que el 'valor':

var originalAttr = $.fn.attr; 
    $.fn.attr = function (name, val) { 
     if (name === 'value' && this[0].nodeName.toLowerCase() == 'button' && val === undefined) return $(this).val(); 
     return originalAttr.apply(this, arguments); 
    } 

para IE9 es necesario comprobar:

if (elem.getAttributeNode("value") != undefined) { // code };