Question

我的问题是我正在尝试根据更改的下拉列表来更新textarea的文本。

因此，如果更改了下拉列表1，textarea将进行更新，但是如果更改下拉列表2，它将再次更新textarea。我当前的代码如下：

<html>
<head>
  <script type="text/javascript">
    function responseText(product) {
      document.getElementById("resptext").value = document.getElementById(product).value;
    }

    function CopyToClipboard() {
      let selector = document.querySelector('#resptext')
      selector.select()
      document.execCommand('copy')
    }
  </script>
</head>
<body>
  <div style="float: left;">Dropdown 1<br />
    <select id="thingama" onClick="responseText(thingama); ">
      <option></option>
      <option value="test 1">1</option>
      <option value="test 2">2</option>
    </select>
  </div>
  <br/>
  <br/>
  <br/>
  <div style="float: left;">Dropdown 2<br />
    <select id="thingama1" onClick="responseText(thingama1); ">
      <option></option>
      <option value="test 3">3</option>
      <option value="test 4">4</option>
    </select>
  </div>
  <textarea id="resptext" style=" width: 600px;  height: 400px;"></textarea>
  <button onClick="CopyToClipboard()">Copy</button>
</body>
</html>

我认为我的问题在于如何尝试传递变量，但是我缺少一些我认为会非常简单的东西。任何帮助表示赞赏。

Answer 1

您的代码几乎没有问题，首先应使用onchange，然后应使用它代替名称

<!html>
<head>
<script type="text/javascript">
function responseText(product){
  document.getElementById("resptext").value=product.value;
}
function CopyToClipboard() {

  let selector = document.querySelector('#resptext')
  selector.select()
  document.execCommand('copy')
}
</script>
</head>
<body>
<div style="float: left;">Dropdown 1<br />
<select id="thingama" onchange="responseText(this); ">
<option></option>
<option value="test 1">1</option>
<option value="test 2">2</option>
</select>
</div>
<br/>
<br/>
<br/>
<div style="float: left;">Dropdown 2<br />
<select id="thingama1" onchange="responseText(this); ">
<option></option>
<option value="test 3">3</option>
<option value="test 4">4</option>
</select>
</div>
<textarea id="resptext" style=" width: 600px;  height: 400px;"></textarea>

<button onClick="CopyToClipboard()">Copy</button>
</body>
</html>

根据更改的下拉列表填充文本区域

1 个答案: