2012-01-04 13 views
13

Tengo 2 scripts de jQuery, uno antes de agregar .preventDefault y una copia del mismo script después de agregar el .preventDefault. jQuery trabaja en la inicial, pero no después agrego .preventDefault()jQuery .preventDefault();

guión inicial que funciona

$(window).load(function(){ 
     $(document).ready(function(){ 
     $("span[id$='_ff5_1']").each(function() { //returns a collection of elements that must be iterated through using each 
      if ($(this).text() == "Yes") { //test value returned from non-input field 
       clearID(); 
       $("tr.anon").hide(); 
      } else { 
       $("tr.anon").show(); 
      } 
     }); 
     if ($("select[title='action']").val() == "") { 
      $("tr.actDet").hide();  
     } 
     $("select[title='organizationalElement']").focusout(function() {   
      if ($(this).val() === "I don\'t know") {    
      alert("If no organizational element is selected, additional time may be required to route this request");   
      } // close if  
      $("select[title='action']").change(function(){   
       $(".actDet").toggle($(this).val()!= "");  
      }); // close action.change 
     });//close select.focusout 
     }); // close doc.ready 
    }); // close window.load 

script que no funciona ...

$(window).load(function(){ 
    $(document).ready(function(){ 
    $("span[id$='_ff5_1']").each(function() { //returns a collection of elements that must be iterated through using each 
     if ($(this).text() == "Yes") { //test value returned from non-input field 
      clearID(); 
      $("tr.anon").hide(); 
     } else { 
      $("tr.anon").show(); 
     } 
    }); 
    if ($("select[title='action']").val() == "") { 
     $("tr.actDet").hide();  
    } 
    $("select[title='organizationalElement']").focusout(function() {   
     if ($(this).val() !== "I don\'t know") { 
     $(this).preventDefault(); 
     } else {    
     alert("If no organizational element is selected, additional time may be required to route this request");   
     } // close if  
     $("select[title='action']").change(function(){   
      $(".actDet").toggle($(this).val()!= "");  
     }); // close action.change 
    });//close select.focusout-- close edit record stuff 
    }); // close doc.ready 
}); // close window.load 

El único cambio que hizo es la declaración if inicial se convierte en if/else que llama a .preventDefault(). El primer script funciona bien, pero el segundo script falla. ¿Por qué? Estoy llamando al método .preventDefault() si el valor de organizationalElement es idk en un registro existente.

@ Andrew: Para aclarar en su edición ... ¿Debo revisar mi guión a: ...

if ($(this).val() !== "I don\'t know") { 
    $(this).click(function(e) { e.preventDefault(); }); 
    } else {    
    alert("If no organizational element is selected, additional time may be required to route this request");   
    } // close if 

... b/c Noté taht que funcionará correctamente si cambio $ (this) .preventDefault(); a e.preventDefault();

¿Está tratando de mostrar cómo escribirlo si deseo adjuntar el método al objeto $ (this) tal como lo había escrito originalmente?

Respuesta

31

que desea llamar preventDefault en el objeto de evento, no this

$("select[title='organizationalElement']").focusout(function(e) {   
    if ($(this).val() !== "I don\'t know") { 
    e.preventDefault(); 
    } 
}); 

simplemente para la corrección, tenga en cuenta que preventDefault impide la acción predeterminado de este elemento-navegación por la página con el valor de el atributo href para un anclaje, por ejemplo (no estoy seguro de cuál es la acción predeterminada para el enfoque de una selección, o si existe alguna). preventDefaultno previenen el burbujeo.

Si te preocupa el burbujeo, y no estoy diciendo que necesariamente deba hacerlo, devolver falso desde un controlador de evento jQuery evitará la acción predeterminada y también evitará el burbujeo.

+0

Gracias Adam.Soy consciente de que preventionDefault no impide que el evento burbujee, sin embargo, no estoy seguro de que no desee el burbujeo. ¿Es eso quizás lo que detuvo todo el script de jQuery? – jg100309

+2

@ jg100309 - no, su problema original era que llamaba a preventDefault en esto, en lugar del objeto de evento. Pase el objeto del evento a su controlador, y invoque preventDefault en * it *, como en mi respuesta –

+1

* Nota al margen: No tiene que escapar del carácter ''' si está entre dos '" 's. * – SeinopSys

8

La función preventDefault() está asociada con el evento. Lo que debe estar llamando es:

e.preventDefault(); 

edición para aclarar basa en su comentario, es necesario agregar e como una variable en la llamada de función:

$('selector').click(function(e) { e.preventDefault(); }); 

Puede leer más acerca de en la página jQuery preventDefault.

+0

Bien, por lo que SIEMPRE será e.preventDefault(); – jg100309

4

El método preventDefault se debe aplicar al objeto de evento, no al objeto DOM mientras lo está haciendo.

El código debería ser:

$("select[title='organizationalElement']").focusout(function(e) {   
     if ($(this).val() !== "I don\'t know") { 
     e.preventDefault(); 
     } else {    
     alert("If no organizational element is selected, additional time may be required to route this request");   
     } // close if  
     $("select[title='action']").change(function(){   
      $(".actDet").toggle($(this).val()!= "");  
     }); // close action.change 
    });//close select.focusout-- close edit record stuff 

Avísame si eso ayuda!

Cuestiones relacionadas