jQuery get textarea texto

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?

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
});

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');

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.

Normalmente, é a propriedade value

testArea.value

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

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.

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.

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

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

function keys(e) {
  msg.innerHTML = `last key: ${String.fromCharCode(e.keyCode)}`
  
  if(e.key == 'Enter') {
    console.log('send: ', mycon.value);
    mycon.value='';
    e.preventDefault();
  }
}

Push enter to 'send'<br>
<textarea id='mycon' onkeydown="keys(event)"></textarea>

<div id="msg"></div>

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

document.addEventListener('keyup', keys);

let conShow = false

function keys(e) {
  if (e.code == 'Backquote') {
    conShow = !conShow;
    mycon.classList.toggle("showcon");
  } else {
    if (conShow) {
      if (e.code == "Enter") {
        conTextOld.innerHTML+= '<br>' + conText.innerHTML;
        let command=conText.innerHTML.replace(/&nbsp;/g,' ');
        conText.innerHTML='';
        console.log('Send to server:', command); 
      } 
      else if (e.code == "Backspace") {
        conText.innerHTML = conText.innerText.slice(0, -1);
      } else if (e.code == "Space") {
        conText.innerHTML = conText.innerText + '&nbsp;'
      } else {
        conText.innerHTML = conText.innerText + e.key;
      }

    }
  }
}

body {
  margin: 0
}

.con {
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  align-items: flex-start;
  width: 100%;
  height: 90px;
  background: rgba(255, 0, 0, 0.4);
  position: fixed;
  top: -90px;
  transition: top 0.5s ease-out 0.2s;
  font-family: monospace;
}

.showcon {
  top: 0px;
}

.conTextOld {
  color: white;
}

.line {
  display: flex;
  flex-direction: row;
}

.conText{   color: yellow; }

.carret {
  height: 20px;
  width: 10px;
  background: red;
  margin-left: 1px;
}

.start { color: red; margin-right: 2px}

Click here and Press tilde ` (and Enter for "send")

<div id="mycon" class="con">
  <div id='conTextOld' class='conTextOld'>Hello!</div>
  <div class="line">
    <div class='start'> > </div>
    <div id='conText' class="conText"></div>
    <div class='carret'></div>
  </div>
</div>

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();