วิธีการเปลี่ยนเนื้อหาของ <textarea> ด้วย Javascript

139

ฉันจะเปลี่ยนเนื้อหาของ<textarea>องค์ประกอบด้วย JavaScript ได้อย่างไร

ฉันต้องการทำให้มันว่างเปล่า

javascript

244

แบบนี้:

document.getElementById('myTextarea').value = '';

หรือเช่นนี้ใน jQuery:

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

ที่ที่คุณมี

<textarea id="myTextarea" name="something">This text gets removed</textarea>

สำหรับบรรดานักปฏิวัติและผู้ที่ไม่เชื่อ

นี่คือข้อมูลอ้างอิง MSDN

value Property: ดึงหรือตั้งค่าข้อความในช่องรายการขององค์ประกอบ textArea
นี่คือการอ้างอิง MDN

value DOMString มูลค่าดิบที่มีอยู่ในการควบคุม

— เกร็ก
แหล่งที่มา

ไม่คิดว่าคุณค่าจะได้ผลเพราะไม่มี value = อยู่ในนั้น แต่ขอบคุณ!

— เอียน

1

ไม่ทำงานใน internet explorer บนอุปกรณ์พกพา windows

— Paul

9

ใช้งานไม่ได้กับ chrome v61 ค่าไม่ส่งผลกระทบที่อยู่ในกล่องป้อนข้อมูล

— Aero Wang

15

หากคุณสามารถใช้ jQuery และฉันขอแนะนำให้คุณทำคุณก็จะทำ

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

มิฉะนั้นจะขึ้นอยู่กับเบราว์เซอร์ สมมติว่าคุณมี

var myTextArea = document.getElementById('myTextArea');

ในเบราว์เซอร์ส่วนใหญ่ที่คุณทำ

myTextArea.innerHTML = '';

แต่ใน Firefox คุณทำ

myTextArea.innerText = '';

การพิจารณาว่าผู้ใช้ใช้เบราว์เซอร์ใดเป็นแบบฝึกหัดสำหรับผู้อ่าน ยกเว้นว่าคุณใช้ jQuery แน่นอน;)

แก้ไข : ฉันเอามันกลับมา ดูเหมือนว่าการสนับสนุน .innerHTML บน textarea ได้รับการปรับปรุง ฉันทดสอบใน Chrome, Firefox และ Internet Explorer ทุกคนล้าง textarea อย่างถูกต้อง

แก้ไข 2 : และฉันเพิ่งตรวจสอบถ้าคุณใช้. val ('') ใน jQuery เพียงแค่กำหนดคุณสมบัติ. value สำหรับ textarea ดังนั้นค่าควรปรับ

— Aistina
แหล่งที่มา

3

.value = ''; ทำงานใน Chrome FF และ Safari ... .innerHTML ไม่ทำงานใน Chrome ไม่ได้ทดสอบกับคนอื่น

— เอียน

1

คุณไม่ควรใช้ innerHTML และ innerText สำหรับ textareas ควรใช้แอตทริบิวต์ value ดังนั้น $ ('# myTextArea'). val ('') หรือ document.getElementById ('myTextArea'). value = '' เป็นตัวเลือกที่ดีที่สุด

— Parth

8

แม้ว่าจะได้คำตอบที่ถูกต้องหลายคำตอบแล้ว แต่วิธีดั้งเดิม (อ่านไม่ใช้ DOM) จะเป็นดังนี้:

document.forms['yourform']['yourtextarea'].value = 'yourvalue';

ที่ HTML ของคุณ textarea ซ้อนอยู่ที่ไหนสักแห่งในรูปแบบนี้:

<form name="yourform">
    <textarea name="yourtextarea" rows="10" cols="60"></textarea>
</form>

และเมื่อมันเกิดขึ้นนั่นจะทำงานกับNetscape Navigator 4 และ Internet Explorer 3 ด้วย และไม่สำคัญว่า Internet Explorer บนอุปกรณ์พกพา

— พอล
แหล่งที่มา

2

ถ้า Jquery ของมัน ..

$("#myText").val('');

หรือ

document.getElementById('myText').value = '';

http://www.hscripts.com/tutorials/javascript/dom/textarea-events.php

— TigerTiger
แหล่งที่มา

2

ใส่ textarea ลงในแบบฟอร์มตั้งชื่อพวกมันและใช้วัตถุ dom ง่ายๆเช่นนี้

<body onload="form1.box.value = 'Welcome!'">
  <form name="form1">
    <textarea name="box"></textarea>
  </form>
</body>

— Shrdi
แหล่งที่มา