jQuery .preventDefault();

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/8730505/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-08-27 10:57:56  来源:igfitidea点击:

jQuery .preventDefault();

jquerypreventdefault

提问by jg100309

I have a 2 jQuery scripts- one before I added .preventDefault, and a copy of the same script after I added the .preventDefault. jQuery works in the initial, but not after I add .preventDefault()

我有 2 个 jQuery 脚本——一个是在我添加 .preventDefault 之前,另一个是在我添加 .preventDefault 之后的同一个脚本的副本。jQuery 在初始时有效,但在我添加 .preventDefault() 后无效

Initial script that works

初始脚本有效

$(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 that does not work...

脚本不起作用...

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

The only change I made is the initial if statement becomes an if/else that calls .preventDefault(). The first script works great, but the second script fails. Why? I'm calling the .preventDefault() method if the value of the organizationalElement is idk on an existing record.

我所做的唯一更改是最初的 if 语句变成了调用 .preventDefault() 的 if/else。第一个脚本很好用,但第二个脚本失败了。为什么?如果组织元素的值在现有记录上是 idk,我将调用 .preventDefault() 方法。

@Andrew: To clarify on your edit... Should I revise my script to: ...

@Andrew:为了澄清你的编辑......我应该修改我的脚本:......

   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 I noted taht it will work correctly if I change $(this).preventDefault(); to e.preventDefault();

... b/c 我注意到如果我更改 $(this).preventDefault(); 它将正常工作。e.preventDefault();

Are you perhaps trying to show how to write it if I wish to attach the method to the $(this) object as I'd originally written it?

如果我希望将方法附加到 $(this) 对象,就像我最初编写的那样,您是否可能试图展示如何编写它?

回答by Adam Rackis

You want to call preventDefaulton the event object, not this

您想调用preventDefault事件对象,而不是this

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


Just for completeness, note that preventDefaultprevents the default actionof this element—navigating the page to the value of the href attribute for an anchor, for example (I'm not sure what the default action is for a select's focusout, or if there even is one). preventDefaultdoes notprevent bubbling.

只是为了完整起见,请注意这会preventDefault阻止此元素的默认操作- 例如,将页面导航到锚点的 href 属性值(我不确定选择的焦点的默认操作是什么,或者是否有是一个)。preventDefault不能防止冒泡。

If you happen to care about bubbling—and I'm not saying that you necessarily should—returning false from a jQuery event handler will both prevent the default action, and also prevent bubbling.

如果你碰巧关心冒泡——我并不是说你一定应该——从 jQuery 事件处理程序返回 false 既可以防止默认操作,也可以防止冒泡。

回答by Andrew Hymanman

The preventDefault()function is associated with the event. What you should be calling is:

preventDefault()功能与事件相关联。你应该叫的是:

e.preventDefault();

editto clarify based on your comment, you need to add eas a variable in the function call:

编辑以根据您的评论进行澄清,您需要e在函数调用中添加为变量:

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

You can read more about in on the jQuery preventDefaultpage.

您可以在jQuery preventDefault页面上阅读更多信息。

回答by Deleteman

The preventDefaultmethod should be applied to the event object, not to the DOM object as you're doing it.

preventDefault方法应该应用于事件对象,而不是在您执行此操作时应用于 DOM 对象。

Your code should be:

你的代码应该是:

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

Let me know if that helps!

如果有帮助,请告诉我!