首页 > 解决方案 > 选择下拉填充文本框在 chrome 中不起作用

问题描述

我相信这将是一个愚蠢的问题。但是,我很想弄清楚如何解决这个问题。

我正在尝试设计一个小型网络应用程序,当您从下拉列表中选择一个选项时,文本框中的信息会自动填充。

这在 Firefox 中完美运行,但在 chrome 中不起作用。

下面是代码:

<!DOCTYPE html>
<html>

<script>

function myCopy() {
  var copyText = document.getElementById("myText");
  copyText.select();
  document.execCommand("Copy");
}

function emaila() {
    document.getElementById("myText").value += 'I hope you are going good.\n\n' 
}

function emailb() {
    document.getElementById("myText").value += 'As per our recent conversation, this email is in regards to your Workwear inquiry. Please find the proof of delivery which is attached to this email.\n\n'
}

</script>

<body>

<select class="block2" autocomplete="off">
<option value="">Email Template's</option>
  <option value="1" onClick="emaila()">Greeting</option>
  <option value="3" onClick="emailb()">POD</option>
  <option value="4" onClick="emailc()">Forward to Relevant Team</option>
  <option value="5" onClick="emaile()">Sales Lead</option>
<option value="2" onClick="emaild()">Thank You</option>
</select>

<form action="" method="post" enctype="text/plain">
<textarea id="myText" class="textbox"></textarea>
<div>
<button type="button" class="block11" onClick="document.getElementById('myText').value = ''">Clear</button></div>
<div><button type="button" class="block12" onclick="myCopy()">Copy</button></button></div>

</body>

如果有人能在这方面启发我,那将是惊人的?

标签: javascripthtml

解决方案


您可以在 select 上调用 onchange 事件,然后使用条件语句设置 textarea 值

<select class="block2" id="mySelect" onchange="myOption()" autocomplete="off">
<option value="">Email Template's</option>
  <option value="1" >Greeting</option>
  <option value="3">POD</option>
  <option value="4">Forward to Relevant Team</option>
  <option value="5">Sales Lead</option>
<option value="2">Thank You</option>
</select>

<form action="" method="post" enctype="text/plain">
<textarea id="myText" class="textbox"></textarea>
<div>
<button type="button" class="block11" onClick="document.getElementById('myText').value = ''">Clear</button></div>
<div><button type="button" class="block12" onclick="myCopy()">Copy</button></button></div>
<script>
function myCopy() {
  var copyText = document.getElementById("myText");
  copyText.select();
  document.execCommand("Copy");
}

function myOption() {
var select = document.getElementById("mySelect").value;
if (select == '1') {
document.getElementById("myText").value = "I hope you are going good.\n\n";
}
if (select == '3') {
document.getElementById("myText").value = "As per our recent conversation, this email is in regards to your Workwear inquiry. Please find the proof of delivery which is attached to this email.\n\n";
}

}
</script>


推荐阅读