it-swarm.com.de

Die Eingabe wird zweimal per Tastendruck ausgelöst

Diese Frage wurde (meistens) schon einmal gestellt/beantwortet, ABER ich habe drei Dinge ausprobiert, um das Sprudeln des Ereignisses zu verhindern, aber nichts hat funktioniert

return false;
e.stopPropagation();
e.preventDefault();  

(return false sollte sich um die anderen beiden kümmern, richtig?)

Hier ist das HTML:

<div class="tags-holder">
    <input type="text" class="addField" id="addField_<%= visit.id %>"  placeholder="add a new tag">
</div>

Und das JS (UPDATE CLEANED UP):

    $('.addField').show().keyup(function(event){
  event.preventDefault();

      if(event.keyCode == 13 || event.keyCode==9) {
    ProfilePage.createTag( this, 'nada', 'addField')
        $(this).hide().val('');

        return false;       
   }

}); 

Ich habe die überflüssigen Stopper dort gelassen, sollte aber wirklich nicht falsch zurückkehren, einfach das Sprudeln töten? (mit Chrome).

Hinweis? keyCode = 13 ist "Enter"

20
bear

Beeindruckend. Ihre Hilfe war großartig und hat mir geholfen, es zu überdenken. 

ABER die Lösung fühlt sich ein bisschen wie ein Cop-Out an; wirksam, aber der Zustand sollte niemals überhaupt da sein. 

Hier ist es, was ich in den Kommentaren von hier gefunden habe: 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;       
   });
11
bear

Ich hatte dasselbe Problem und ich habe oben genannte Methode verwendet und es funktioniert für mich. 

$(document).unbind('keypress').bind('keypress', function (e) {
   // some logic here
});
8
Goyat Parmod

Lösen Sie zuerst das Ereignis und binden Sie es anschließend. Siehe folgenden Code:

$('.addField').show().unbind('keyup').keyup(function(event){
 event.preventDefault();

  if(event.keyCode == 13 || event.keyCode==9) {
ProfilePage.createTag( this, 'nada', 'addField')
    $(this).hide().val('');

    return false;       
}

Eine Erklärung ist hier , ich hatte in meinem neuen Blog darüber einen Beitrag geschrieben.

6
Ghost-Man

Ich hoffe, das wird Ihr Problem lösen. Verwenden Sie anstelle von event.preventDefault () die beiden unten gezeigten. Verwenden Sie bei Microsoft-Browsern Event.cancelBubble = true; Bei W3C-Modellbrowsern verwenden Sie Event.stopPropagation ();

Verwenden Sie statt des Keyup-Ereignisses das Keypress-Ereignis, da während des Tastendrucks die Eingabe an das Eingabefeld gesendet wird, sodass alle Eingaben, die Sie nicht anzeigen möchten, im Feld angezeigt werden. Das Enter-Button-Ereignis wird also ausgelöst. 

Statt false zurückzugeben, verwenden Sie event.returnValue = false.

1
AmGates

Ändern Sie alle Instanzen von 

$(field).functionCall() 

zu 

field.functionCall() 

da field bereits ein jQuery-Objekt ist.

Ok, jetzt haben wir festgestellt, dass dies nicht der Fehler war. Ich habe Firefox 7 und Chrome 15 getestet und sah, dass der Codeblock in der if -Anweisung nur einmal ausgelöst wird, wenn die Eingabetaste gedrückt wird. Stellen Sie sicher, dass etwas in der Funktion createTag () nicht zweimal ausgeführt wird.

0
Yes Barry

Dies ist ein Problem, das mich immer in den Wahnsinn treibt, aber ich denke, dies ist die Lösung . Geben Sie einfach false zurück. Wenn Sie true zurückgeben, wird es von selbst wiedergegeben, und es muss ein Listener vorhanden sein, der nach echten Antworten sucht.

Kurze Antwort Add return false;

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

});

in der ursprünglichen Frage, wenn Sie sich den Code genau ansehen, scheint die Rückgabe falsch eine Zeile zu früh geschrieben worden zu sein.

0
Daniel Lee

Was denkst du, fängt das Ereignis an, wenn es sprudelt. Ich bekomme nur einen Schuss mit dieser Testseite.

<!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>

Vielleicht ist es deine Wahl. Ist es in einem anderen .addTag verschachtelt? Wenn ich den jQuery-Selektor ändere und auch das div und die Eingabe der gleichen Klasse mache, fange ich an, zwei Ereignisse auszulösen. So was:

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

...und...

<div class="thing">
    <input class="thing" type="text" />
</div>
0
mqsoh