Question

我的脚本中有一个HTML表单，其中包含一些下拉列表。例如：

<select name="1">
<option value="a">a</option>
<option value="b">b</option>
<option value="c">c</option>
</select>


<select name="2">
<option value="a">a</option>
<option value="b">b</option>
<option value="c">c</option>
</select>

如您所见，两个列表中的选项完全相同。我该怎么做，阻止用户选择相同的选项？例如，如果用户从列表“1”中选择选项“b”，然后尝试从列表“2”中选择选项“b”，我希望列表“1”中的所选选项消失，因此用户可以'提交相同的值......

抱歉我的英文。我希望我能说清楚......

Answer 1

您可以验证表单以执行此操作。

经过测试的工作代码：

    <html>
<head>

<script>
//put this javascript function in the header. this validates the from one you click the submit button
function validateForm() {
    var x = document.forms["myForm"]["box1"].value;//this is the selection of dropdown box 1
    var y = document.forms["myForm"]["box2"].value;//this is the selection of dropdown box 2
    if (x == y) {//use the if statement to check if the selection are the same 
        alert("Selection Cannot Be the Same");//error message
        eturn false;
    }
}
</script>

</head>

<body>

<form name="myForm" action=""
onsubmit="return validateForm()" method="">
<!--onsubmit calls the function once the submit button is clicked-->

<select name="box1">
<option value="a">a</option>
<option value="b">b</option>
<option value="c">c</option>
</select>

<select name="box2">
<option value="a">a</option>
<option value="b">b</option>
<option value="c">c</option>
</select>

<input type="submit" value="Submit">
</form>

</body>
</html>

Answer 2

您可以在选择一个列表选项时提交表单，并使用缩小的选项列表重新显示。

表格下拉列表

2 个答案: