具有下拉列表的表格

问题描述 投票:0回答:2

我的脚本中有一个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”中选择的选项消失,因此用户可以t提交相同的值...

对不起,我的英语。我希望我能说清楚...

html forms select drop-down-menu
2个回答
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
        return 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>

0
投票

[您可以在选择一个列表选项时提交表单,然后使用减少的选项列表重新显示。

© www.soinside.com 2019 - 2024. All rights reserved.