主页 / 问题 / 1588842
Accepted
Max
Asked:2024-07-30 10:44:59 +0800 CST2024-07-30 10:44:59 +0800 CST

通过单击按钮将值插入文本区域

  • 772

需要一个原生的js解决方案。有一个文本区域，当您单击按钮时，应将其值插入其中（每个值都在新行上）：

<button data="0001">Add</button>
<button data="0002">Add</button>
<button data="0003">Add</button>

文本区域的结果：

0001
0002
0003
...

如何实现这样的事情？

javascript

2 个回答

  1. Best Answer

    需要一个原生的js解决方案。有一个文本区域，当您单击按钮时，应将其值插入其中（每个值都在新行上）：

    我会建议这个选项...

    document.querySelector('section').addEventListener('click', e => {
  const o = e.target.closest('[data]')
  if (!o) return
  const ot = document.querySelector('textarea')
  const v = o.getAttribute('data')
  const t = ot.value ? '\n' : ''
  ot.value += t + v
})
    <section>
  <button data="0001">Add</button>
  <button data="0002">Add</button>
  <button data="0003">Add</button>
</section>
<textarea></textarea>

    • 2

  2. 你可以这样做。我们通过 id 找到按钮，然后通过单击将文本添加到文本区域的末尾

    const textarea = document.getElementById('textarea');
const button1 = document.getElementById('button1');
const button2 = document.getElementById('button2');
const button3 = document.getElementById('button3');

button1.addEventListener('click', () => {
   textarea.value += "Текст 1\n";
});

button2.addEventListener('click', () => {
   textarea.value += "Текст 2\n";
});

button3.addEventListener('click', () => {
   textarea.value += "Текст 3\n";
});
    <textarea id="textarea" rows="10" cols="50"></textarea>
<br>
<button id="button1">Текст 1</button>
<button id="button2">Текст 2</button>
<button id="button3">Текст 3</button>

    • 1

相关问题