Javascript 无法在下拉列表中选择相同的值。验证

Javascript 无法在下拉列表中选择相同的值。验证,javascript,jquery,html,css,Javascript,Jquery,Html,Css,我希望能够验证我的下拉列表 共有6个目的地,如果用户要在“出发”下拉列表中选择加的夫,那么如果他们要在“目的地”下拉列表中再次选择加的夫,则应显示一个消息框,说明“目的地不能与出发地相同” 这需要在HTML和JavaScript/JQuery中完成 谢谢 Departure: <br> <select> <option value="" disabled selected>Please Select</option> &l

我希望能够验证我的下拉列表

共有6个目的地,如果用户要在“出发”下拉列表中选择加的夫,那么如果他们要在“目的地”下拉列表中再次选择加的夫,则应显示一个消息框,说明“目的地不能与出发地相同”

这需要在HTML和JavaScript/JQuery中完成

谢谢

Departure: <br> <select> 
    <option value="" disabled selected>Please Select</option>
        <option>Birmingham</option>
        <option>Bristol</option>
        <option>Cardiff</option>
        <option>Liverpool</option>
        <option>London</option>
        <option>Manchester</option>
</select><br><br>

Destination: <br><select>
   <option value="" disabled selected>Please Select</option>
        <option>Birmingham</option>
        <option>Bristol</option>
        <option>Cardiff</option>
        <option>Liverpool</option>
        <option>London</option>
        <option>Manchester</option>
</select><br><br>

非常快速的示例,但基本上您可以执行以下操作:

小提琴:

我感觉有点被召唤,所以让我解释一下这里发生了什么

$('#select1, #select2').on('change',
首先,我选择要测试的两个输入,并将更改事件附加到它们。每次输入值更改并失去焦点时,都会触发此事件

if ($('#select1').val() == $('#select2').val()) {
    // Display message
}
else {
    // Remove message if displayed
}
在这个函数中,我们得到两个输入的两个值,我们要测试它们是否相等。如果它们相同,则显示消息。如果没有,则不执行任何操作,或者在某些情况下删除显示的消息


同样,这是一个非常快速的解决方案,它可以更加动态,并且根据您的具体场景进行考虑。这是非常简单的JavaScript/jQuery。我建议你在网上读一些书,或者是免费的课程来教授这些基础知识。一个简单的谷歌搜索会找到大量这样的代码示例和教你如何做的网站。

从可用性的角度来看,甚至不在另一个选择框中显示重复选项可能更有意义。@J4G我知道怎么做。但我不想发生这种事。我需要显示一个消息框。你实现了什么代码?你能发帖吗?@DannyFardyJhonstonBermúdez我似乎无论如何都不能发。我尝试过但删除了我的javascipt=/我知道这与idI有关。我发现很难相信您知道如何从select中删除选项,但不知道如何在表单的onSubmit方法中检查两个输入值之间的相等性,以便在返回false之前发出警报。不管怎样,这是你的解决办法。没有人叫你出来,你只是唯一的答案!对不起,我让你有这种感觉!不管怎样,祝贺你解释得很深入,我本应该做同样多的事情,而不是对提问者大加指责。@Aaron别担心!我不是故意的。我应该解释一下解决办法。你说得对!你让我努力成为一个更好的答案!=]
if ($('#select1').val() == $('#select2').val()) {
    // Display message
}
else {
    // Remove message if displayed
}