Javascript HTML下拉驗證

我希望能夠將驗證添加到我的下拉列表中。如果用戶在第二個下拉（選擇2）選擇在第一個下拉列表（選擇1）加的夫，並再次，如果應該給一個警告消息發送到用戶說：「目標不能是相同離境」。Javascript HTML下拉驗證

我知道這是不是用戶友好的，但它需要做的事情= S

我得到的問題與第二個下拉因爲它似乎並不像一個雙人牀和if語句來工作。

請使用jsfiddle.net來幫助我的感謝。

Departure: <br> 
<select id="select1"> 
    <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 id="select2"> 
    <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> 

<input type="Button" value="Order Tickets" onClick="myFunction()"> 

<script> 
    function myFunction() 
    { 
     if (document.getElementById("select1" && "select2").value == "Cardiff") 
      alert("Destination can't be same as Departure."); 
     else 
      alert("That's Fine"); 
    } 
</script>

來源

2015-11-13 Imraanstack2

是什麼東西呢？ '的document.getElementById（「選擇1」 && 「選擇2」）'這比'的document.getElementById（「選擇2」）' –

@MarcosPérezGudeAnd語句平等的嗎？ – Imraanstack2

你似乎知道如何選擇一個元素。比較兩個這樣的元素的值。忘記加迪夫，這與卡迪夫無關。 –

您需要獲取兩個選擇的值。

var one=document.getElementById("select1"); 
var two=document.getElementById("select2"); 

if (one.options[one.selectedIndex].value == two.options[two.selectedIndex].value) 
    alert("Destination can't be same as Departure");

來源

2015-11-13 11:48:48 ojovirtual

內部發出AND語句謝謝它的工作=） – Imraanstack2

最好使用唯一名稱作爲選項值。

Departure: <br> 
<select id="select1"> 
<option value="" disabled selected>Please Select</option> 
    <option value="1">Birmingham</option> 
    <option value="2">Bristol</option> 
    <option value="3">Cardiff</option> 
    <option value="4">Liverpool</option> 
    <option value="5">London</option> 
    <option value="6">Manchester</option> 
</select><br><br> 

Destination: <br> 
<select id="select2"> 
<option value="" disabled selected>Please Select</option> 
    <option value="1">Birmingham</option> 
    <option value="2">Bristol</option> 
    <option value="3">Cardiff</option> 
    <option value="4">Liverpool</option> 
    <option value="5">London</option> 
    <option value="6">Manchester</option> 
</select><br><br> 

    <input type="Button" value="Order Tickets" onClick="myFunction()"> 

<script> 

function myFunction() { 

if (document.getElementById("select1").value == document.getElementById("select2").value) 
    alert("Destination can't be same as Departure."); 

else 
    alert("That's Fine"); 
} 
</script>

來源

2015-11-13 11:49:41

也工作=）） – Imraanstack2

function myFunction() { 

if (document.getElementById("select1").value === "Cardiff" && document.getElementById("select2").value === "Cardiff") 
    alert("Destination can't be same as Departure."); 

else 
    alert("That's Fine"); 
}

或更好：

function myFunction() { 

if (document.getElementById("select1").value === document.getElementById("select2").value) 
    alert("Destination can't be same as Departure."); 

else 
    alert("That's Fine"); 
}

來源

2015-11-13 11:49:42

也工作=）） – Imraanstack2

更換

if (document.getElementById("select1" && "select2").value == "Cardiff")

與

if (document.getElementById("select1").value == document.getElementById("select1").value) { 
    ... 
}

而且，你會貝特如果您從目的地列表中刪除了出發地，請關閉。但是你的問題中的代碼聽起來像是對你目前的技能來說有點太過分了。

來源

2015-11-13 11:49:44 Burki

也工作=）） – Imraanstack2

我已經更新您的JavaScript。這是代碼。

function myFunction() { 
    var dest1 = document.getElementById("select1").value; 
    var dest2 = document.getElementById("select2").value; 
if (dest1 === dest2) 
    alert("Destination can't be same as Departure."); 
else 
    alert("That's Fine"); 
}

來源

2015-11-13 11:56:42

Javascript HTML下拉驗證

回答

相關問題