Javascript изпраща ключови кодове към елемент ‹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>

Някакви идеи как мога да постигна това?


person Community    schedule 05.08.2009    source източник


Отговори (5)


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

Не всички браузъри (за които знам) ви позволяват да изпращате събития, а не просто да ги задействате. Но дори това далеч не е перфектно

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

Опитайте тази:

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

Ето пример: очевидно добавяте към свойството value на текстовото поле .

person ChrisW    schedule 05.08.2009

Събитието 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

Не можете просто да "създавате" събития на машината на клиента. Не можете ли да си представите потенциалните уязвимости в сигурността? Това е безсмислено. Единственото нещо, което можете да направите, е да задействате манипулатор на събития...

textarea2.onkeydown();
person Josh Stodola    schedule 05.08.2009