JQuery получить текстовый текст


486

Недавно я начал играть с jQuery и прошел несколько уроков. Теперь я чувствую себя немного компетентным с его использованием (это довольно легко), и я подумал, что было бы здорово, если бы я смог создать «консоль» на своей веб-странице (например, вы нажимаете клавишу «как» в играх FPS , и т. д.), а затем верните его на сервер Ajax для выполнения каких-либо задач.

Первоначально я думал, что лучшим способом было бы просто получить текст внутри текстовой области, а затем разделить его или использовать событие keyup, преобразовать возвращаемый код ключа в символ ASCII, добавить символ в строку и отправить строку в сервер (затем очистить строку).

Я не смог найти никакой информации о получении текста из текстовой области, все, что я получил, это информация о ключах. Кроме того, как я могу преобразовать возвращаемый код ключа в символ ASCII?

Ответы:


713

Почему вы хотите конвертировать нажатия клавиш в текст? Добавьте кнопку, которая отправляет текст внутри текстовой области на сервер при нажатии. Вы можете получить текст, используя атрибут value в качестве постера, на который указывал ранее, или используя API jQuery:

$('input#mybutton').click(function() {
    var text = $('textarea#mytextarea').val();
    //send to server and process response
});

2
Поскольку текстовая область будет содержать больше, чем просто необходимый текст. (это консоль, визуализируйте командную строку). Спасибо за информацию о функции val. :)
RodgerB

Вы можете обрабатывать текст с помощью JavaScript. Какой смысл возвращать коды клавиш?
Эран Гальперин

Дело в том, что, imo, получение кода нажатия клавиш было бы более эффективным, чем разделение текстовой области разделителем (представьте, возможно, большой массив текста).
RodgerB

2
Извините, я не могу представить себе сценарий, в котором это было бы правдой ... возможно, если вы отредактировали свой оригинальный пост и добавили пример, он поможет людям, пытающимся ответить
Эран Гальперин,

Я забыл часть textarea перед тегом html id
Ясит Прабуддхака,

36

Если вы часто используете текстовую функцию (например, в div и т. Д.), То для текстовой области это значение val.

получить:

$('#myTextBox').val();

набор:

$('#myTextBox').val('new value');

24

У вас должен быть div, который просто содержит консольные сообщения, то есть предыдущие команды и их вывод. А внизу поместите ввод или текстовую область, которая просто содержит команду, которую вы вводите.

-------------------------------
| consle output ...           |
| more output                 |
| prevous commands and data   |
-------------------------------
> This is an input box.

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


Да, именно то, что я думал. Это единственное чистое решение, которое не включает в себя ни разбор входных данных из выходных данных (глупо пытаться - что делать, если пользователь вводит какие-то «выходные данные»), ни попытки создать строку из событий нажатия клавиш (глупо пытаться - как насчет возврата и т. д.?).
Ник Перкинс

3
Еще одна проблема XY на SO. Это, безусловно, лучшее решение «Х» его проблемы.
Реймиус

14

Обычно это свойство value

testArea.value

Или мне чего-то не хватает в том, что тебе нужно?


Я на самом деле надеялся, что событие с измененной текстовой информацией или что-то в этом направлении будет вызвано (в любом случае я мог бы сделать это довольно легко с событием keyup). Я думаю, что я буду использовать событие keyup, но знаете ли вы способ преобразования кода ключа в символ ASCII? Спасибо. :)
RodgerB

8

Я понял, что я могу преобразовать keyCode события в символ, используя следующую функцию:

var char = String.fromCharCode(v_code);

Затем я бы добавил символ в строку, а когда нажата клавиша ввода, отправьте строку на сервер. Извините, если мой вопрос показался мне несколько загадочным, а заголовок означал что-то совершенно не по теме, сейчас раннее утро, и я еще не завтракал;).

Спасибо за вашу помощь, ребята.


7

Метинкс слово «консоль» вызывает путаницу.

Если вы хотите эмулировать полнодуплексную консоль старого стиля, вы должны использовать что-то вроде этого:

$('console').keyup(function(event){
    $.get("url", { keyCode: event.which }, ... );
    return true;
});

событие, которое имеет клавишу, которая была нажата. Для обработки возврата, event.which === 8.



0

Прочитайте значение textarea и преобразование кода в символ:

А ниже симпатичный Quake как консоль только на div-ов :)


0

Вы можете получить данные textarea по имени и идентификатору

// by name
<textarea name="comment"></textarea>
let text_area_data = $('textarea[name="comment"]').val();

// by id
<textarea id="comment" name="comment"></textarea>
let text_area_data = $('textarea#comment').val();
Используя наш сайт, вы подтверждаете, что прочитали и поняли нашу Политику в отношении файлов cookie и Политику конфиденциальности.
Licensed under cc by-sa 3.0 with attribution required.