最初のドロップダウン

Question

HTML-

<label >Parameter Name: </label> 
    <select id="name" name="name" required> 
    </select> </br> </br> 
    <label >Address: </label> 
    <select class= "address" type=text id="address" name="address" style="width:14em;" required> 
    </select> </br> </br> 
    <label >Data Size: </label> </br> 
    <select type=text id=sizeSelect name="size"style="width: 14em;" required> 
    </select> </br> </br> 

js-第二と第三のドロップダウン選択

私は何とかインタフェースを許可したい

function processFile(e) { 
    var file = e.target.result, 
    results; 
    if (file && file.length) { 
    results = file.split(","); 
    $('select').children().remove(); 
    for (var i = 1; i < results.length; i=i+8) { 
     if(typeof results[i] !== 'undefined') { 
      $("select[name='address']").each(function() { 
      $(this).append('<option val="i">' + results[i] + '</option>'); 
      }); 
     } 
     if(typeof results[i+6] !== 'undefined') { 
      $("select[name='name']").each(function() { 
      $(this).append('<option val="i">' + results[i+6] + '</option>'); 
     }); 
     } 
     if(typeof results[i+1] !== 'undefined') { 
      $("select[name='size']").each(function() { 
      $(this).append('<option val="i">' + results[i+1] + '</option>'); 
     }); 
     } 
    } 
    } 
} 

クライアントは、値1名とアドレスオプションを選択したときになるようにその値のサイズが自動的に選択されます。何か案は？

Answer 1

jQuery .val()を使用すると、選択タグの値を取得して設定できます。

それぞれのオプションが選択される次の選択オプションの値を持つ属性が含まれている、あなたがすべてを減らすことができます選択した場合：

$(function() { 
 
    $('#address').on('change', function(e) { 
 
    var optionSelected = $(this).find('option:selected'); 
 
    $('#name').val(optionSelected.attr('name')); 
 
    $('#sizeSelect').val(optionSelected.attr('sizeSelect')); 
 
    }) 
 
});

<script src="https://code.jquery.com/jquery-1.12.4.min.js"></script> 
 

 
<form> 
 
    <label>Parameter Name: </label> 
 
    <select id="name" name="name" required> 
 
     <option></option> 
 
     <option value="1" >Name 1</option> 
 
     <option value="2">Name 2</option> 
 
    </select><br><br> 
 

 
    <label>Address: </label> 
 
    <select class="address" type=text id="address" name="address" style="width:14em;" required> 
 
     <option></option> 
 
     <option value="1" name="1" sizeSelect="1">Address 1</option> 
 
     <option value="2" name="2" sizeSelect="2">Address 2</option> 
 
    </select> <br><br> 
 
    <label>Data Size: </label> </br> 
 
    <select type=text id=sizeSelect name="size" style="width: 14em;" required> 
 
     <option></option> 
 
     <option value="1">Size 1</option> 
 
     <option value="2">Size 2</option> 
 
    </select> <br> <br> 
 
</form>