javascript - 填充字段文本区域不同的选择
问题描述
我已经被这个问题困住了几天。我正在尝试创建选择并通过选择填充“textarea”中的字段。我做了什么以及我正在尝试做什么的一个例子。图像已编辑。我不知道如何创建多个提供相同文本区域的选择。
function fillFild() {
var myList = document.getElementById("myList");
document.getElementById("fild").value = myList.options[myList.selectedIndex].value;
}
function fillFild1() {
var myList = document.getElementById("myList1");
document.getElementById("fild1").value = myList.options[myList.selectedIndex].value;
}
<form name="Form">
Select your Device:
<select id="myList" name="select_field" onchange="fillFild();">
<option value="Laptop: ">Laptop</option>
<option value="PC:">PC</option>
<option value="Smartphone: ">Smartphone</option>
<option value="Tablet: ">Tablet</option>
</select>
<form name="Form1">
Select your Problem:
<select id="myList1" name="select_field" onchange="fillFild1();">
<option value="Software: ">Software</option>
<option value="Hardware:">Hardware</option>
</select>
<textarea name="TextArea" id="fild1" style="position:absolute;left:23px;top:153px;width:394px;height:119px;z-index:5;" rows="7" cols="47" spellcheck="false"></textarea>
</form>
提前致谢!
解决方案
我看到你正在努力添加一个帖子。您添加的那个已经关闭,您仍然添加几乎相同的内容。不是这样;) 首先,仔细阅读如何提问how-to-ask
下面你有你的问题的解决方案:
const selectElements = document.querySelectorAll('.select_field');
const textArea = document.querySelector('textarea');
[].slice.call(selectElements).map(el => el.addEventListener('change', e => {
const selcted = e.target.value;
if (selcted !== '') {
textArea.value += selcted + '\n';
}
}));
<div>
Select your Device:
<select id="myList" name="select_field" class="select_field">
<option value="">-- choose --</option>
<option value="Laptop:">Laptop</option>
<option value="PC:">PC</option>
<option value="Smartphone:">Smartphone</option>
<option value="Tablet:">Tablet</option>
</select>
</div>
<div>
Select your Problem:
<select id="myList1" name="select_field" class="select_field">
<option value="">-- choose --</option>
<option value="Software:">Software</option>
<option value="Hardware:">Hardware</option>
</select>
</div>
<textarea name="TextArea" id="fild1" rows="7" cols="47" spellcheck="false"></textarea>
推荐阅读
- javascript - 从本地存储中获取项目返回 null
- javascript - 未捕获的类型错误:_models_Search__WEBPACK_IMPORTED_MODULE_0___default.a 不是构造函数
- cordova - 问题调用 isAvailable 方法 @ionic-native/email-composer
- javascript - 禁用 touchableopacity 直到验证为真
- nginx - 我如何从 nginx 的多个位置提供相同的位置?
- bash - 无法使用 az 输出提供数组
- python - 如何使用 ctypes 从进程中获取 DLL 的基地址?
- r - 为什么我在 R 中 cox 模型的 ANOVA 测试中出现错误?
- ajax - 使用 ttl 在 Fuseki 上优化 SPARQL 查询
- gcc - XBurst (MXU2) SIMD 寄存器的 GCC 内联汇编约束?