如何在用户提交表单之前检索选中的选项?

Question

我试图获得在多选中选择的数据。但是，我想在表单的另一个字段中显示选中的选项。因此，在获取数据并显示它之前，我不想发送实际的表单。

我想使用这个值主要是从数据库中收集信息，它给用户指定了一个选择选项的数量!

我从不同的线程尝试了多种不同的解决方案，但不幸的是他们没有工作!

选择我想要收集的选项:

<div class="col-12">
<label for="misstanke" class="form-label">Lagöverträdelser</label>
<select multiple name="misstanke[]" onkeydown="return event.key != 'Enter';" class="form-select form-select-md">
<?php
include('selects/overtradelser.php');
?>
</select>
</div>

输入字段我想在:

中显示数据

<div class="mb-3">
<label for="straff" class="form-label">Påföljder</label>
<input type="text" onkeydown="return event.key != 'Enter';" class="form-control" name="straff" id="straff">
</div>

代码:

function Straff() {
var select1 = document.getElementById("misstanke");
var selected1 = [];
for (var i = 0; i < select1.length; i++) {
if (select1.options[i].selected) selected1.push(select1.options[i].value);
}
document.getElementById("straff").setAttribute('value', select1);
}

Answer 1

要更新输入的值，请将其赋值给其value属性，而不是属性。

您应该使用join()方法将数组转换为带有指定分隔符的字符串。

document.getElementById("straff").value = selected1.join(',');