jQuery के textarea टेक्स्ट मिलते हैं

Question

हाल ही में मैंने jQuery के साथ खेलना शुरू किया है, और कुछ ट्यूटोरियल का अनुसरण कर रहा हूं। अब मैं इसे इस्तेमाल करने में थोड़ा सक्षम महसूस कर रहा हूं (यह बहुत आसान है), और मुझे लगा कि अगर मैं अपने वेबपेज पर 'कंसोल' बनाने में सक्षम था, तो आप कूल होंगे, जैसे आप एफपीएस गेम्स में करते हैं, वैसे ही 'कुंजी दबाएं' आदि), और फिर यह Ajax ही सर्वर में वापस करने के लिए सामान करने के लिए है।

मैंने मूल रूप से सोचा था कि सबसे अच्छा तरीका यह होगा कि आप केवल टेक्स्टारिया के अंदर पाठ प्राप्त कर सकते हैं, और फिर इसे विभाजित कर सकते हैं, या मुझे कीप इवेंट का उपयोग करना चाहिए, ASCII वर्ण में लौटे कीकोड को रूपांतरित करें, चरित्र को एक स्ट्रिंग में जोड़ें और स्ट्रिंग भेजें। सर्वर (तब स्ट्रिंग को खाली करें)।

मैं एक textarea से पाठ प्राप्त करने के बारे में कोई जानकारी नहीं मिल सकता है, मुझे मिल गया सभी keyup जानकारी थी। इसके अलावा, मैं ASCII वर्ण में लौटे कीकोड को कैसे परिवर्तित कर सकता हूं?

Answer 1

आप मुख्य स्ट्रोक को टेक्स्ट में क्यों बदलना चाहेंगे? एक बटन जोड़ें जो पाठय पाठ के अंदर पाठ को सर्वर पर भेजता है जब क्लिक किया जाता है। आप मूल्य विशेषता का उपयोग करके पाठ को पोस्टर के रूप में इंगित कर सकते हैं, या jQuery के एपीआई का उपयोग करके प्राप्त कर सकते हैं:

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

Comments

क्योंकि textarea अधिक होता है तो बस पाठ की जरूरत है। (यह कंसोल है, कमांड प्रॉम्प्ट कल्पना करें)। वैल फ़ंक्शन पर जानकारी के लिए धन्यवाद। :)

— रॉगरब सिप

आप जावास्क्रिप्ट का उपयोग करके पाठ को संसाधित कर सकते हैं। कुंजी स्ट्रोक कोड वापस करने का क्या मतलब है?

— एरन गैल्परिन

बिंदु है, imo, कुंजी स्ट्रोक कोड प्राप्त करना अधिक कुशल होगा फिर एक सीमांकक द्वारा textarea को विभाजित करना (चित्र संभवतः पाठ का एक बड़ा सरणी)।

— RodgerB

क्षमा करें, मैं उस परिदृश्य की कल्पना करने में विफल रहा हूं जिसमें यह सच होगा ... हो सकता है कि यदि आपने अपने मूल पोस्ट को संपादित किया और एक उदाहरण जोड़ा तो यह जवाब देने की कोशिश करने वाले लोगों की मदद करेगा

— एरन गैल्परिन

मैं html टैग आईडी के 'टेक्सटारिया' भाग को भूल गया

— यासिथ प्रबुद्धका

Answer 2

जहां यह अक्सर आपके द्वारा उपयोग किए जाने वाले पाठ फ़ंक्शन (जैसे divs आदि में) के बाद पाठ क्षेत्र के लिए यह वैल है

प्राप्त:

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

सेट:

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

Answer 3

आपके पास एक div होना चाहिए जिसमें बस कंसोल संदेश शामिल हैं, अर्थात, पिछले कमांड और उनका आउटपुट। और नीचे एक इनपुट या टेक्सारिया रखें जो आपके द्वारा लिखी गई कमांड को रखता है।

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

इस तरह आप सिर्फ प्रोसेसिंग के लिए सर्वर को इनपुट बॉक्स का मूल्य भेजते हैं, और परिणाम को कंसोल मैसेज डिव में जोड़ते हैं।

Comments

हां, बिल्कुल वही जो मैं सोच रहा था। यह एकमात्र स्वच्छ समाधान है जो आउटपुट से इनपुट को पार्स करने की कोशिश नहीं करता है (मूर्ख बनने की कोशिश करें - क्या होगा यदि उपयोगकर्ता कुछ "आउटपुट" पर टाइप करता है), या कीस्ट्रोक घटनाओं से एक स्ट्रिंग बनाने की कोशिश कर रहा है (मूर्खतापूर्ण प्रयास करने के लिए - बैकस्पेस, आदि के बारे में क्या?)।

— निक पर्किंस

एसओ पर एक और XY समस्या। यह स्पष्ट रूप से उसकी समस्या के 'एक्स' का सबसे अच्छा समाधान है।

— 17

Answer 4

आम तौर पर, यह मूल्य संपत्ति है

testArea.value

या क्या कुछ ऐसा है जो मुझे आपकी आवश्यकता के कारण याद आ रहा है?

Comments

मैं वास्तव में एक textchanged घटना या लाइन के साथ कुछ करने की उम्मीद कर रहा हूँ (मैं वैसे भी कीप घटना के साथ यह बहुत आसानी से कर सकता है)। मुझे लगता है कि मैं की-अप इवेंट का उपयोग करने के लिए चिपकू रहूंगा, लेकिन क्या आपको पता है कि कीकोड को ASCII char में बदलने का कोई तरीका है? धन्यवाद। :)

— रॉगरब सिप २

Answer 5

मुझे पता चला है कि मैं निम्नलिखित फ़ंक्शन का उपयोग करके ईवेंट की कीकोड को किसी वर्ण में बदल सकता हूं:

var char = String.fromCharCode(v_code);

वहाँ से मैं फिर एक स्ट्रिंग के लिए चरित्र संलग्न होगा, और जब दर्ज करें कुंजी दबाया जाता है तो सर्वर को स्ट्रिंग भेजें। मुझे खेद है कि अगर मेरा सवाल कुछ गूढ़ लग रहा था, और शीर्षक का अर्थ लगभग पूरी तरह से बंद विषय है, यह सुबह जल्दी है और मैंने अभी तक नाश्ता नहीं किया है;)।

मदद के लिए आप सभी का धन्यवाद।

Answer 6

"कंसोल" शब्द मिथक भ्रम पैदा कर रहा है।

यदि आप एक पुराने-शैली पूर्ण / आधा डुप्लेक्स कंसोल का अनुकरण करना चाहते हैं, तो आप कुछ इस तरह का उपयोग करेंगे:

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

event.which कुंजी है कि दबाया गया था। बैकस्पेस हैंडलिंग के लिए, event.which === 8।

Answer 7

सबसे अच्छा तरीका: $ ('# myTextBox')। वैल ('नया मूल्य')। ट्रिम ();

Answer 8

पढ़ें textarea मूल्य और कोड-चार रूपांतरण:

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>

और केवल डी-एस पर सांत्वना की तरह अच्छा भूकंप नीचे :)

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>

Answer 9

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