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()，您可以获取并设置选择标记的值。

如果每个选项的选项包含一个属性，其值为要选择的下一个选择选项，则可以将全部减少为：

＆＃13;

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

＆＃13;

<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>

＆＃13;

First Dropdown选择第二和第三个下拉列表

1 个答案: