jQuery .preventDefault (); - PullRequest
       18

jQuery .preventDefault ();

13 голосов
/ 04 января 2012

У меня есть 2 сценария jQuery - один до того, как я добавил .preventDefault, и копия того же сценария после того, как я добавил .preventDefault.jQuery работает в начальной, но не после того, как я добавляю .preventDefault ()

Начальный скрипт, который работает

$(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 

Скрипт, который не работает ...

$(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 

Единственное изменение, которое я сделал, - это первоначальный оператор if, который становится if / else, вызывающим .preventDefault ().Первый скрипт прекрасно работает, но второй скрипт не работает.Зачем?Я вызываю метод .preventDefault (), если значение значения organizElement равно idk для существующей записи.

@ Эндрю: Чтобы уточнить ваши изменения ... Должен ли я изменить свой сценарий на: ...

   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 Я заметил, что это будет работать правильно, если я изменю $ (this) .preventDefault ();to e.preventDefault ();

Возможно, вы пытаетесь показать, как написать его, если я хочу присоединить метод к объекту $ (this), как я его изначально написал?

Ответы [ 3 ]

31 голосов
/ 04 января 2012

Вы хотите вызвать preventDefault для объекта события, а не this

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

Только для полноты обратите внимание, что preventDefault предотвращает действие по умолчанию этого элемента - например, для перехода на страницу к значению атрибута href для привязки (я не уверен, какое действие по умолчанию применяется для фокуса выбора или если оно вообще есть).preventDefault не не предотвращает образование пузырьков.

Если вам небезразлично возникновение пузырей, а я не говорю, что это обязательно нужно, возвращение false из обработчика событий jQuery предотвратит действие по умолчанию, а также предотвратит появление пузырей.

8 голосов
/ 04 января 2012

Функция preventDefault() связана с событием.Вы должны вызывать:

e.preventDefault();

edit , чтобы уточнить на основе вашего комментария, вам нужно добавить e в качестве переменной в вызове функции:

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

Подробнее об этом можно узнать на странице jQuery предотвращение ошибок по умолчанию .

4 голосов
/ 04 января 2012

Метод preventDefault должен применяться к объекту события, а не к объекту DOM, как вы это делаете.

Ваш код должен быть:

$("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

Дайте мне знать, если это поможет!

...