啓用下一個選擇之後，並非全部

我有這些選擇元素。我想要做的，是在第一個殘疾人後的下兩個。當第一個被選中時，只有在選擇後才能啓用下一個ONE。啓用下一個選擇之後，並非全部

$(document).ready(function(){ 
 
    $('.model-select').prop('disabled', 'disabled'); 
 
    $('.year-select').prop('disabled', 'disabled'); 
 
}); 
 

 
$('select').change(function(){ 
 
    $('.carSelect').next().attr('disabled',''); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script> 
 
<div class="make-list" id="make-list"> 
 
         <div class="make-wrap"> 
 
          <select class="carSelect make-select"> 
 
           <option>Make</option> 
 
           <option data-tag="audi" data-index="0">Audi</option> 
 
           <option data-tag="bmw" data-index="1">BMW</option> 
 
          </select> 
 
         </div> 
 
         <div class="model-wrap"> 
 
          <select class="carSelect model-select"> 
 
           <option>Model</option> 
 
          </select> 
 
         </div> 
 
         <div class="year-wrap"> 
 
          <select class="carSelect year-select"> 
 
           <option>Year</option> 
 
          </select> 
 
         </div> 
 
        </div>

我做了每次嘗試消除從兩個選擇後的禁用，但這不是所需要的。只有一個之後。

來源

2017-09-13 Darian

你說一步一步？一旦第一次選擇，啓用其他2？或者先選擇，啓用2nd，如果選擇2nd，啓用3rd？ – Se0ng11

如果不一步，選擇第一個步驟，使所有然後

$('select').change(function(){ 
    $('.carSelect').closest('div').next().find('select').prop('disabled',false); 
});

如果一步一步實現，然後（選擇1，使第2，選擇2，使第三）

$('select').change(function(){ 
    $(this).closest('div').next().find('select').prop('disabled',false); 
});

來源

2017-09-13 08:49:15 Se0ng11

你可以添加數據ID來選擇，並使用它們來啓用它們。這樣，即使您的HTML結構發生變化，代碼也會保持不變。

$(document).ready(function(){ 
 
    $('.model-select').prop('disabled', 'disabled'); 
 
    $('.year-select').prop('disabled', 'disabled'); 
 
}); 
 

 
$('select').change(function(){ 
 
    $("select[data-id='"+($(this).data("id")+1)+"']").prop("disabled",'') 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div class="make-list" id="make-list"> 
 
         <div class="make-wrap"> 
 
          <select class="carSelect make-select" data-id="0"> 
 
           <option>Make</option> 
 
           <option data-tag="audi" data-index="0">Audi</option> 
 
           <option data-tag="bmw" data-index="1">BMW</option> 
 
          </select> 
 
         </div> 
 
         <div class="model-wrap"> 
 
          <select class="carSelect model-select" data-id="1"> 
 
           <option>Model</option> 
 
           <option data-tag="A57" data-index="0">Audi</option> 
 
          </select> 
 
         </div> 
 
         <div class="year-wrap"> 
 
          <select class="carSelect year-select" data-id="2"> 
 
           <option>Year</option> 
 
          </select> 
 
         </div> 
 
        </div>

來源

2017-09-13 08:53:32 Amit

啓用下一個選擇之後，並非全部

回答

相關問題