Javascript отправляет коды клавиш элементу ‹textarea›

Я не могу понять, как вызвать событие keydown для элемента textarea, например. представьте, что у меня есть два элемента textarea, и когда я набираю что-то в первом, я хочу, чтобы второе поле также отображало ввод, но по определенной причине я должен делать это через события. Это то, что я пробовал, и это не работает:

<script language="javascript" type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.js"></script>

<textarea id='first'></textarea>
<textarea id='second'></textarea>

<script>
    jQuery("#first").keydown(function(event)
    {
        var keydown = jQuery.Event("keydown")
        keydown.keyCode = event.keyCode
        keydown.which = event.which
        jQuery("#second").trigger(keydown)
    })
</script>

Любые идеи, как я могу этого достичь?


javascript jquery event-handling keydown
person Community    schedule 05.08.2009    source источник

Ответы (5)


arrow_upward
2
arrow_downward

Событие отправлено, браузер просто не реагирует на него (т.е. вставляет символы в текстовое поле)

Не все браузеры (из тех, что я знаю) позволяют отправлять события, а не просто запускать их. Но даже это далеко не идеально

// Gecko only
$("#first").keypress(function(event)
{
  var evt = document.createEvent('KeyEvents');
  evt.initKeyEvent(
      event.type
    , event.bubbles
    , event.cancelable
    , event.view
    , event.ctrlKey
    , event.altKey
    , event.shiftKey
    , event.metaKey
    , event.keycode
    , event.charCode
  );
  $('#second')[0].dispatchEvent( evt );
});

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

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

$("#first").bind( 'keyup change', function(event)
{
  $('#second').trigger( 'mimic', $(this).val() );
});
$("#second").bind( 'mimic', function( event, value )
{
  $(this).val( value );
})

Это достаточно хорошо?

person Peter Bailey    schedule 05.08.2009

arrow_upward
1
arrow_downward

Попробуй это:

$(document).ready(function() {
var $comment = '';
$('#first').keyup(function() {
    $comment = $(this).val();
    $comment = $comment.replace(/<\/?[^>]+>/g,"").replace(/\n/g, "<br />").replace(/\n\n+/g, '<br /><br />'); // this strips tags and then replaces new lines with breaks
    $('#second').html( $comment );
});
});

Рабочая демонстрация: http://jsbin.com/ivulu

Или, если вы не хотите дезинфицировать данные: http://jsbin.com/oposu

$(document).ready(function() {
var $comment = '';
$('#first').keyup(function() {
    $comment = $(this).val();
    $('#second').html( $comment );
});
});
person jyoseph    schedule 05.08.2009
comment
Как я уже говорил в вопросе, я не могу просто присвоить значение первого поля второму, я должен сделать это через события. Долгая история, почему, это просто должно идти по этому пути - person ; 05.08.2009

arrow_upward
0
arrow_downward

Вот пример: очевидно, вы добавляете к свойству value текстовой области .

person ChrisW    schedule 05.08.2009

arrow_upward
0
arrow_downward

Событие keydown не отвечает за фактическое обновление значения текстового поля. Ваш код работает отлично, но, поскольку у вас нет обработчика событий во втором текстовом поле, похоже, что ничего не происходит. Если вы хотите обновить текст в текстовом поле, измените его значение, как продемонстрировал jyoseph.

Если вам нужно также инициировать событие (по какой-то причине), ваш написанный код сделает это.

person Adam Bellaire    schedule 05.08.2009
comment
хорошо, вот реальная проблема - при нажатии клавиши мне нужно знать, создает ли нажатая клавиша видимый символ, например. если я нажму a, я увижу a, но если я нажму клавишу со стрелкой, то в текстовом поле ничего не изменится. Итак, что я пытаюсь сделать, это создать динамическое вспомогательное текстовое поле и в обработчике нажатия клавиши моего первого поля повторно отправить событие в это динамическое поле и посмотреть, изменится ли его значение... я не вижу другого способа надежно определить, нажата ли клавиша это символ или специальная клавиша (подумайте о комбинациях ALT+‹какой-то многозначный код›, которые создают видимый специальный символ — как еще я могу это обнаружить?) - person ; 05.08.2009
comment
Лучше всего вести список невидимых кодов клавиш (из такого списка, как aspdotnetfaq.com/Faq/) и явно игнорировать их. Вы не можете изменить содержимое текстового поля, используя только события, события просто не нужны, когда дело доходит до интерактивных элементов управления. Если еще немного вернуться назад, зачем вам нужно отличать видимые коды клавиш от невидимых? - person Adam Bellaire; 05.08.2009
comment
Кстати, ALT+(числа) не будет отправлять код клавиши для символа высокого ASCII, а фактически отправит последовательность кодов клавиш, по одному для каждой нажатой клавиши (ALT, число, число и т. д.) - person Adam Bellaire; 05.08.2009

arrow_upward
-2
arrow_downward

Вы не можете просто «создавать» события на клиентской машине. Вы не представляете потенциальные уязвимости безопасности? Это не проблема. Единственное, что вы можете сделать, это запустить обработчик событий...

textarea2.onkeydown();
person Josh Stodola    schedule 05.08.2009