发表新帖
发表新帖

Input Fires Keypress Event Twice

后端 未结
关注
8 2209
小蘑菇
小蘑菇 2021-02-18 14:26

This question has been asked/answered (mostly) before, BUT I\'ve tried three things to stop the event from bubbling but nothing has worked:

return false;
e.stopPr
相关标签:
8条回答
  • 太阳男子
    2021-02-18 14:44

    Hope this will solve your problem. Instead of using event.preventDefault() use these two shown below. In case of Microsoft browsers use event.cancelBubble = true; In case of W3C model browsers use event.stopPropagation();

    And Instead of Keyup event kindly use the keypress event, because during keypress itself the input will be sent to input field so whatever inputs you don't want to appear will appear on the field. So the enter button event will be triggered.

    Instead of return false use event.returnValue = false.

    0 讨论(0)
  • 没有蜡笔的小新
    2021-02-18 14:46

    Try changing all the instances of 

    $(field).functionCall()

    to 

    field.functionCall()

    since field is already a jQuery object.

    Ok now we've established that this wasn't the error. I tested in Firefox 7 and Chrome 15 and saw that the code block in the if statement is only fired once when enter is pressed. Try checking to make sure that something inside the createTag() function isn't doing something twice.

    0 讨论(0)
  • 悲哀的现实
    2021-02-18 14:46

    I had this issue using Angular 11 EventEmitters. I solved it by creating a new instance of my event emitter whenever the event is triggered.

    @Output() keypress = new EventEmitter();
onKeyPress(event) {
   this.keypress = new EventEmitter();
   this.keypress.emit(event);
 }
    0 讨论(0)
  • 遥遥无期
    2021-02-18 14:47

    This is a problem which always drives me insane but i think this is the solution simply return false, if you return true it repeats it self randomly so im guessing it must have a listener which listens out for true responses.

    Short Answer Add return false;

    $("#register-form #first_name").keyup(function(event) {
console.log('hello world');
return false;

    });

    in the original question if you look at the code closely is seems the return false was written one line too early.

    0 讨论(0)
  • 梦毁少年i
    2021-02-18 14:50

    What do you think is catching the event when it bubbles. I only get one firing with this test page.

    <!DOCTYPE html>
<html>
  <head>
    <title>Scratch</title>
    <script type="text/javascript" src="https://www.google.com/jsapi"></script>
    <script type="text/javascript">
      google.setOnLoadCallback(function (){
        $('input[type="text"]').keyup(function (){
          console.debug('keyup');
        });
      });
      google.load('jquery', '1.6.4');
    </script>
  </head>
  <body>

    <div class="something">
      <input type="text" />
    </div>
  </body>
</html>

    Maybe it's your selector. Is it nested inside another .addTag? When I change the jQuery selector and also make the div and input the same class I start to get two events firing. Like this:

    $('.thing').show().keyup(...);

    ...and...

    <div class="thing">
    <input class="thing" type="text" />
</div>
    0 讨论(0)
  • 遇见更好的自我
    2021-02-18 14:53

    Wow. Your help was great and helped me think it through.

    BUT the solution feels a bit like a cop-out; effective, but the condition should never be there in the first place.

    Here it is, which I found in the comments from here: http://yuji.wordpress.com/2010/02/22/jquery-click-event-fires-twice/

        $('.plus').unbind('click').bind('click',function(e){    
console.log('clicked')
    var id=$(this).attr('plus_id');
    var field=$('<input type="text">').attr({'placeholder':'add a new tag','id': 'addField_' + id, 'visit_id':id});
    field.focus();
    field.show().keydown(function(event){
        event.stopImmediatePropagation();
        if(event.keyCode == 13 || event.keyCode==9) {
            console.log(event)
            ProfilePage.createTag( field, 'nada', 'addField')
            field.hide().val('');
            return false;       
        }
    }).click(function(e){
        return false;
    })
    ;
$(this).append(field);
return false;       
   });
    0 讨论(0)
 看不清?
提交回复
热议问题