下拉列表驗證

在我的表單中，我有三個下拉列表來選擇日期。和他們相應的可用時間。如果選擇星期一和時間早上的可用日期。然後在休息時間休息兩個下拉列表上午的時間應該被禁用。 HTML代碼爲：下拉列表驗證

DAY 1:<select id="day1" title="- Select day -" name="wd1" id="wd1" tabindex="14" > 
          <option selected>-select-</option> 
       <option value="1" >Sunday</option> 
          <option value="2" >Monday</option> 
          <option value="3" >Tuesday</option> 
          <option value="4" >Wednesday</option> 
          <option value="5" >Thursday</option> 
       <option value="6" >Friday</option> 
          <option value="7" >Saturday</option> 
          </select> 

TIME 1 : <select name="tslot1" id="tslot1" tabindex="15"> 
<option selected>-select-</option> 
<option>Morning(8-12)</option> 
<option>Afternoon(12-4pm)</option> 
<option>Evening(4-8pm)</option></select><br><br> 


DAY 2:<select id="day2" title="- Select day -" name="wd2" id="wd2" tabindex="16" > 

          <option selected>-select-</option> 
      <option value="1" >Sunday</option> 
          <option value="2" >Monday</option> 
          <option value="3" >Tuesday</option> 
          <option value="4" >Wednesday</option> 
          <option value="5" >Thursday</option> 
       <option value="6" >Friday</option> 
          <option value="7" >Saturday</option> 
          </select> 

TIME 2 : <select name="tslot2" id="tslot2" tabindex="17" > 
<option selected>-select-</option> 
<option>Morning(8-12)</option> 
<option>Afternoon(12-4pm)</option> 
<option>Evening(4-8pm)</option></select><br/><br/> 

DAY 3:<select select id="day3" title="- Select day -" name="wd3" id="wd3" tabindex="18" > 

          <option selected>-select-</option> 
          <option value="1" >Sunday</option> 
          <option value="2" >Monday</option> 
          <option value="3" >Tuesday</option> 
          <option value="4" >Wednesday</option> 
          <option value="5" >Thursday</option> 
       <option value="6" >Friday</option> 
          <option value="7" >Saturday</option> 
          </select> 

TIME 3 : <select name="tslot3" id="tslot3" tabindex="19" > 
<option selected>-select-</option> 
<option>Morning(8-12)</option> 
<option>Afternoon(12-4pm)</option> 
<option>Evening(4-8pm)</option></select><br/><br/>

請你幫我解決這個問題...

來源

2011-03-27 rashmi

看一看這個腳本http://plungjan.name/test/unique_days.html

應該可以幫助您開始

來源

2011-03-27 17:39:20 mplungjan

在HTML中您使用兩個id的選擇標籤即「day1」和「wd1」。 id是特定標籤的獨特功能。所以你可以用一個id來改變它。

我對HTML頁面進行了以下更改：DAY 1: <select id="day1" title="- Select day -" name="day1" tabindex="14" > <option selected>-select-</option> <option value="1">Sunday</option> <option value="2">Monday</option> <option value="3">Tuesday</option> <option value="4">Wednesday</option> <option value="5">Thursday</option> <option value="6">Friday</option> <option value="7">Saturday</option> </select>。

所以我們可以引用select id「day1」並寫入一個更改函數進行必要的驗證。

Javascript代碼：

$(document).ready(function(){ 
$("#day1").on('change',function() { 

    var index = $('#day1').get(0).selectedIndex; 
    alert(index+"index"); 

    $('#day2 option:eq(' + index + ')').attr("disabled","disabled"); 
    $('#day3 option:eq(' + index + ')').attr("disabled","disabled"); 

});

}）;

其中「day2」和「day3」對應於具有天數的以下選定字段的ID。

同樣的方法也可以處理時間。

來源

2016-06-09 10:07:19

下拉列表驗證

回答

相關問題