jQuery get textarea texto

486

Recentemente, comecei a jogar com o jQuery e segui alguns tutoriais. Agora, sinto-me um pouco competente em usá-lo (é muito fácil) e pensei que seria legal criar um 'console' na minha página da Web (como em você pressiona a tecla `como nos jogos FPS , etc.) e, em seguida, faça com que o Ajax retorne ao servidor para fazer as coisas.

Originalmente, pensei que a melhor maneira seria colocar o texto dentro da área de texto e depois dividi-lo, ou devo usar o evento keyup, converter o código-chave retornado para um caractere ASCII, anexar o caractere a uma string e enviar a string para o servidor (esvazie a sequência).

Não consegui encontrar nenhuma informação sobre como obter texto de uma área de texto, tudo o que obtive foram informações de digitação. Além disso, como posso converter o código de chave retornado para um caractere ASCII?

RodgerB
fonte

Respostas:

713

Por que você deseja converter toques de tecla em texto? Adicione um botão que envia o texto dentro da área de texto para o servidor quando clicado. Você pode obter o texto usando o atributo value como o pôster já apontou, ou usando a API do jQuery:

$('input#mybutton').click(function() {
    var text = $('textarea#mytextarea').val();
    //send to server and process response
});
Eran Galperin
fonte
2
Como a área de texto conteria mais do que apenas o texto necessário. (é console, visualize o prompt de comando). Obrigado por informações sobre a função val. :)
RodgerB 28/09/08
Você pode processar o texto usando javascript. Qual é o sentido de retornar os códigos de pressionamento de tecla?
Erã Galperin
A questão é que, obter o código do pressionamento de tecla seria mais eficiente do que dividir a área de texto por um delimitador (imagine uma matriz possivelmente grande de texto).
RodgerB 28/09/08
2
Desculpe, eu estou deixando de visualizar o cenário em que isso seria verdade ... talvez se você editou seu post original e acrescentou um exemplo que iria ajudar as pessoas a tentar responder
Eran Galperin
Eu esqueci o 'textarea' em frente parte do ID de html tag
Yasith Prabuddhaka
36

Onde geralmente é a função de texto que você usa (por exemplo, em divs, etc.), para a área de texto, é val

pegue:

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

conjunto:

$('#myTextBox').val('new value');
Thomas Koelle
fonte
24

Você deve ter uma div que contenha apenas as mensagens do console, ou seja, comandos anteriores e sua saída. Abaixo, coloque uma entrada ou área de texto que contenha apenas o comando que você está digitando.

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

Dessa forma, basta enviar o valor da caixa de entrada para o servidor para processamento e anexar o resultado à div de mensagens do console.

p3drosola
fonte
Sim, exatamente o que eu estava pensando. É a única solução limpa que não envolve analisar a entrada da saída (é uma tolice tentar - e se o usuário digitar alguma "saída") ou tentar criar uma sequência de eventos de pressionamento de tecla (tolice tentar - e os backspaces, etc?).
Nick Perkins
3
Outro problema XY no SO. Esta é claramente a melhor solução para o 'X' do seu problema.
Reimius
14

Normalmente, é a propriedade value

testArea.value

Ou há algo que estou faltando no que você precisa?

esplêndido
fonte
Na verdade, eu esperava que um evento alterado de texto ou algo da linha fosse chamado (eu poderia fazer isso facilmente com o evento keyup). Acho que vou continuar usando o evento keyup, mas você conhece uma maneira de converter o código de chave em um caractere ASCII? Obrigado. :)
RodgerB 28/09/08
8

Eu descobri que posso converter o keyCode do evento em um caractere usando a seguinte função:

var char = String.fromCharCode(v_code);

A partir daí, eu acrescentaria o caractere a uma string e, quando a tecla Enter for pressionada, enviaria a string ao servidor. Sinto muito se minha pergunta parecia um tanto enigmática, e o título significa algo quase completamente fora de tópico, é de manhã cedo e ainda não tomei café da manhã;).

Obrigado por toda a sua ajuda pessoal.

RodgerB
fonte
7

Acho que a palavra "console" está causando confusão.

Se você deseja emular um console full / half duplex à moda antiga, use algo assim:

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

event.which tem a tecla que foi pressionada. Para manipulação de backspace, event.which === 8.

Eric
fonte
2

da melhor maneira: $ ('# myTextBox'). val ('novo valor'). trim ();

Abolfazl Miadian
fonte
0

Leia o valor da área de texto e a conversão de código-char:

E abaixo do Quake legal como console no div-s only :)

Kamil Kiełczewski
fonte
0

você pode obter dados da área de texto por nome e ID

// 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();
user889030
fonte