选择：合并两个或更多选择的值并将其组合作为输出 [英] SELECT: Combine value of two or more select and get their combination as output

问题描述

我在这个问题上搜索了很多天，我什么也没得到。我需要做一个SELECT DUPLICATE和DUPLICATE和DUPLICATE取决于用户。之后，我需要将我选择的选项中的每个选项的值组合起来。我希望我在这里得到答案。以下代码：

 < button name =duplicateselectclass =btn btn-primary> ADD ANOTHER SELECT< ; /按钮> 
 
< div class =row> 
< div class =col-lg-12> 
< div class =form-group> 
< label for =select1> ELEMENT 1< / label> 
< select class =form-controlname =select2id =select2> 
< option value =H> HYDORGEN< / option> 
< option value =O> OXYGEN< / option> 
< option value =K> POTASSIUM< / option> 
< / select> 
< / div> 
< / div> 
< div class =col-lg-12> 
< div class =form-group> 
< label for =select2> ELEMENT 2< / label> 
< select class =form-controlname =select2id =select2> 
< option value =H> HYDORGEN< / option> 
< option value =O> OXYGEN< / option> 
< option value =K> POTASSIUM< / option> 
< / select> 
< / div> 
< / div> 
< input type =textclass =form-controlplaceholder =Combination Herename =combinationid =combination> 
< / div> 
  

产量应为：

例如我选择了select1 HYDROGEN 和select2 OXYGEN

值应该是 H + O

解决方案

您有两个选择，其中id select2 。你需要改变其中之一。请尝试以下操作：

$（'input [name = duplicateselect'）。 click（function（）{var sel1 = $（'＃select2 option：selected'）.val（）; var sel2 = $（'＃select3 option：selected'）.val（）; $（'＃combination'）。 val（sel1 +'+'+ sel2）}）

< ; script src =https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js>< / script>< input type =submitname =duplicateselect class =btn btn-primary>< div class =row> < div class =col-lg-12> < div class =form-group> < label for =select1> ELEMENT 1< / label> < select class =form-controlname =select2id =select2> < option value =H> HYDORGEN< / option> < option value =O> OXYGEN< / option> < option value =K> POTASSIUM< / option> < /选择> < / DIV> < / DIV> < div class =col-lg-12> < div class =form-group> < label for =select2> ELEMENT 2< / label> < select class =form-controlname =select2id =select3> < option value =H> HYDORGEN< / option> < option value =O> OXYGEN< / option> < option value =K> POTASSIUM< / option> < /选择> < / DIV> < / DIV> < input type =textclass =form-controlplaceholder =Combination Herename =combinationid =combination>< / div>

I having lots of days googling with this problem and I have got nothing. I need to make a SELECT that DUPLICATE and DUPLICATE and DUPLICATE depends upon the user. After that I need to combined the value of every options in a select that I selected. I hope that I've got an answer here. The following codes below:

<button name="duplicateselect" class="btn btn-primary">ADD ANOTHER SELECT</button>

<div class="row">
  <div class="col-lg-12">
    <div class="form-group">
      <label for="select1">ELEMENT 1</label>
      <select class="form-control" name="select2" id="select2">
        <option value="H">HYDORGEN</option>
        <option value="O">OXYGEN</option>
        <option value="K">POTASSIUM</option>
      </select>
    </div>
  </div>
  <div class="col-lg-12">
    <div class="form-group">
      <label for="select2">ELEMENT 2</label>
      <select class="form-control" name="select2" id="select2">
        <option value="H">HYDORGEN</option>
        <option value="O">OXYGEN</option>
        <option value="K">POTASSIUM</option>
      </select>
    </div>
  </div>
  <input type="text" class="form-control" placeholder="Combination Here" name="combination" id="combination">
</div>

OUTPUT SHOULD BE:
e.g. I selected at select1 HYDROGEN and at select2 OXYGEN
value should be H + O

解决方案

You have two select with id select2. You need to change one of them. Try the following:

$('input[name=duplicateselect').click(function(){
    var sel1 = $('#select2 option:selected').val();
    var sel2 = $('#select3 option:selected').val();
    $('#combination').val(sel1+' + '+sel2)
})

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="submit" name="duplicateselect" class="btn btn-primary">
<div class="row">
  <div class="col-lg-12">
    <div class="form-group">
      <label for="select1">ELEMENT 1</label>
      <select class="form-control" name="select2" id="select2">
        <option value="H">HYDORGEN</option>
        <option value="O">OXYGEN</option>
        <option value="K">POTASSIUM</option>
      </select>
    </div>
  </div>
  <div class="col-lg-12">
    <div class="form-group">
      <label for="select2">ELEMENT 2</label>
      <select class="form-control" name="select2" id="select3">
        <option value="H">HYDORGEN</option>
        <option value="O">OXYGEN</option>
        <option value="K">POTASSIUM</option>
      </select>
    </div>
  </div>
  <input type="text" class="form-control" placeholder="Combination Here" name="combination" id="combination">
</div>

这篇关于选择：合并两个或更多选择的值并将其组合作为输出的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！