Detectar cambios programáticos en un cuadro de selección html

¿Hay alguna manera de hacer que un elemento de selección de HTML invoque una función cada vez que su selección se haya cambiado mediante programación?Detectar cambios programáticos en un cuadro de selección html

Tanto IE como FF no se dispararán 'onchange' cuando la selección actual en un cuadro de selección se modifique con javascript. Además, la función js que cambia la selección es parte del marco, por lo que no puedo cambiarla para disparar un onchange() al final, por ejemplo.

He aquí un ejemplo:

<body> 
<p> 
<select id="sel1" onchange="myfunction();"><option value="v1">n1</option></select> 
<input type="button" onclick="test();" value="Add an option and select it." /> 
</p> 
<script type="text/javascript"> 
    var inc = 1; 
    var sel = document.getElementById('sel1'); 
    function test() { 
     inc++; 
     var o = new Option('n'+inc, inc); 
     sel.options[sel.options.length] = o; 
     o.selected = true; 
     sel.selectedIndex = sel.options.length - 1; 
    } 

    function myfunction() { 
     document.title += '[CHANGED]'; 
    } 
</script> 
</body>

¿Hay alguna manera de hacer test() mifuncion llamada() sin cambiar de prueba() (o la adición de un evento en el botón)?

Gracias.

Fuente

2009-08-02 Anonymous

El evento onchange más medios que el usuario cambió su selección y no que las opciones hayan sido cambiadas. – Gumbo

Si puede ampliar/modificar el marco para dar un gancho/devolución de llamada cuando cambian las opciones de selección, sería mejor (una forma podría ser utilizar las capacidades dinámicas de js para ponerlo en pato?).

De lo contrario, existe una solución ineficiente: sondeo. Puede configurar una llamada a setTimeout/setInteval que sondee el elemento dom de la opción de selección deseada y active su devolución de llamada cuando detecte que algo ha cambiado.

en cuanto a la respuesta a su pregunta

¿Hay alguna manera de hacer test() llamada mifuncion() sin cambiar de prueba() (o la adición de un evento en el botón)?

sí, al usar jquery AOP http://plugins.jquery.com/project/AOP, ofrece una solución fácil de usar.

<body> 
<p> 
<select id="sel1" onchange="myfunction();"><option value="v1">n1</option></select> 
<input type="button" onclick="test();" value="Add an option and select it." /> 
</p> 
<script type="text/javascript"> 
    var inc = 1; 
    var sel = document.getElementById('sel1'); 
    function test() { 
     inc++; 
     var o = new Option('n'+inc, inc); 
     sel.options[sel.options.length] = o; 
     o.selected = true; 
     sel.selectedIndex = sel.options.length - 1; 
    } 

    function myfunction() { 
     document.title += '[CHANGED]'; 
    } 

    //change to aop.after if you want to call afterwards  
     jQuery.aop.before({target: window, method: 'test'}, 
     function() { 
      myfunctino(); 
     } 
    ); 
</script> 
</body>

Fuente

2009-08-02 14:48:52 Chii

También pensé en la segunda opción, pero solo usaría el temporizador si este es mi último recurso. La primera solución suena bien, ¿cómo podría extender/anotar la prueba sin modificar su código fuente? –

+1. El sondeo es una opción que vale la pena considerar. Sin embargo, tendría que aceptar que el código que desea invocar en el cambio no se ejecuta de forma síncrona con el cambio. – AnthonyWJones

La solución jQuery.aop funciona como un encanto. ¡Muchas gracias! –

La respuesta es ... no.

El DOM solo activa el evento onchange como resultado de la acción del usuario, no del código. No proporciona ningún evento adicional para enganchar en este sentido.

Deberá personalizar el marco o cancelar su requisito.

Fuente

2009-08-02 14:54:06 AnthonyWJones

ejem ...

se puede acceder al evento 'onPropertyChange' que contiene una propiedad dentro de los argumentos del evento para identificar qué propiedad se ha cambiado.

Detecta tanto 'selectedIndex' y cambios 'valor' - simplemente caso de prueba 'nombrePropiedad' Actualmente estoy trabajando con el marco ASP.NET js Aquí hay un código de copiar y pegar directamente a que:

1) definir manejador:

this._selectionChangedHandler = null;

2) asignar controlador de

this._selectionChangedHandler = Function.createDelegate (esto, esto._onSelectionChanged);

3) adjuntar manejador de eventos

$ addHandler (elemento, "propertyChange", this._selectionChangedHandler);

4) crear la función

_onSelectionChanged: function(ev) { 

if (ev.rawEvent.propertyName == "selectedIndex") 
     alert('selection changed'); 
},

Fuente

2009-09-07 22:14:05

definir su propia función de cambio que llama a la función marco y luego llama a una función de devolución de llamada .

por ejemplo:

function change(callback) 
{ 
    frameworkchange(); 
    callback(); 
}

Fuente

2011-05-01 15:00:51 Sam

con jQuery, que podría hacer algo como

$(document).ready(function(){ 

      $('#select-id').change(function(e){ 
       e.preventDefault(); 
       //get the value of the option selected using 'this' 
       var option_val = $(this).val(); 

        if(option_val == "v1"){ 
         //run your function here 
        } 
       return true; 
      }); 
    });

Esto detectar el cambio de programación y le permiten responder a cada elemento cambiado

Fuente

2014-03-20 05:21:49 Nlinscott

Detectar cambios programáticos en un cuadro de selección html

Respuesta

Cuestiones relacionadas