将不同的名称放入自动生成的文本框中,以便使用checkbox将文本放入其中,可以通过以下步骤实现:
<input>
元素来创建文本框和复选框,设置不同的id
属性来标识它们。<form>
<input type="text" id="name1">
<input type="checkbox" id="checkbox1">
<br>
<input type="text" id="name2">
<input type="checkbox" id="checkbox2">
<br>
<!-- 添加更多的文本框和复选框 -->
</form>
// 获取文本框和复选框的引用
const name1Input = document.getElementById('name1');
const checkbox1 = document.getElementById('checkbox1');
const name2Input = document.getElementById('name2');
const checkbox2 = document.getElementById('checkbox2');
// 获取自动生成的文本框的引用
const generatedText = document.getElementById('generatedText');
// 监听复选框的变化事件
checkbox1.addEventListener('change', function() {
if (checkbox1.checked) {
generatedText.value += name1Input.value + '\n';
}
});
checkbox2.addEventListener('change', function() {
if (checkbox2.checked) {
generatedText.value += name2Input.value + '\n';
}
});
// 添加更多的复选框的监听事件
// 获取生成的文本框的值
const generatedTextValue = generatedText.value;
<textarea id="generatedText" rows="4" cols="50"></textarea>
通过以上步骤,可以实现将不同的名称放入自动生成的文本框中,并使用复选框控制哪些文本被放入其中。
领取专属 10元无门槛券
手把手带您无忧上云