Дважды активируется ввод с клавиатуры - PullRequest
Новая
       0

Дважды активируется ввод с клавиатуры

20 голосов
/ 03 ноября 2011

Этот вопрос был задан / получен ответ (в основном) раньше, НО я попробовал три вещи, чтобы остановить событие, но ничего не помогло: 

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

(возвращение false должно позаботиться о двух других, правильно?)

Вот HTML: 

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

И JS (ОБНОВЛЕНО ОЧИЩЕНО): 

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

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

        return false;       
   }

});

Я оставил там лишние пробки, но на самом деле не должен возвращать ложь, просто убив пузырьки? (используя Chrome).

Clue? keyCode = 13 - это «Enter»

Ответы [ 7 ]

11 голосов
/ 03 ноября 2011

Ничего себе. Ваша помощь была великолепна и помогла мне обдумать это.

НО решение немного похоже на отрыв; эффективный, но условие никогда не должно быть там во-первых.

Вот оно, которое я нашел в комментариях отсюда: 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;       
   });
8 голосов
/ 03 ноября 2015

У меня была та же проблема, и я использовал вышеописанный метод, и он работает для меня. 

$(document).unbind('keypress').bind('keypress', function (e) {
   // some logic here
});
6 голосов
/ 05 ноября 2011

Попробуйте сначала отменить привязку события, а затем связать его, см. Код ниже: 

$('.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;       
}

Объяснение: здесь , я написал сообщение об этом в моем новом блоге.

1 голос
/ 04 ноября 2011

Надеюсь, это решит вашу проблему. Вместо использования event.preventDefault () используйте эти два, показанные ниже. В случае использования браузеров Microsoft event.cancelBubble = true; В случае использования браузеров модели W3C event.stopPropagation (); * * 1 001

И вместо события Keyup любезно используйте событие нажатия клавиши, потому что во время самого нажатия клавиши ввод будет отправлен в поле ввода, поэтому любые поля, которые вы не хотите отображать, появятся в поле. Таким образом, событие кнопки ввода будет вызвано.

Вместо возврата false используйте event.returnValue = false.

0 голосов
/ 08 июня 2013

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

Короткий ответ Добавить возврат false; 

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

});

в первоначальном вопросе, если вы внимательно посмотрите на код, кажется, что возвращаемое значение false было написано на одну строку слишком рано.

0 голосов
/ 03 ноября 2011

Как вы думаете, ловит событие, когда оно пузырится.У меня только одна стрельба с этой тестовой страницы. 

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

Может быть, это ваш селектор.Это вложено в другой .addTag?Когда я изменяю селектор jQuery, а также делаю div и ввожу тот же класс, я начинаю получать два события.Вот так: 

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

... и ... 

<div class="thing">
    <input class="thing" type="text" />
</div>
0 голосов
/ 03 ноября 2011

Попробуйте изменить все экземпляры 

$(field).functionCall()

до 

field.functionCall()

поскольку поле уже является объектом jQuery.

Хорошо, теперь мы установили, что это не ошибка. Я протестировал в Firefox 7 и Chrome 15 и увидел, что блок кода в операторе if срабатывает только один раз, когда нажимается ввод. Попробуйте проверить, чтобы убедиться, что что-то внутри функции createTag () ничего не делает дважды.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.

Нет похожих вопросов

...