2015-12-08 4 views
-4

У меня есть очень простой html-документ с двумя выпадающими списками. Когда выбраны конкретные значения в выпадающих меню, я хотел бы, чтобы он отображал определенную цену в текстовой области ниже.Показать цену из html drop down selection

У меня есть настройка выпадающих списков, но я не могу найти способ показать конкретные цены для выпадающих вариантов.

Любые советы и подсказки были бы весьма признательны!

Вот мой html.

<div class="form-group"> 
    <label class="col-md-4 control-label" for="current">select</label> 
    <div class="col-md-5"> 
    <select id="current" name="current" class="form-control"> 
     <option value="1">1</option> 
     <option value="2">2</option> 
     <option value="3">3</option> 
     <option value="4">4</option> 
     <option value="5">5</option> 
     <option value="6">6</option> 
     <option value="7">7</option> 
     <option value="8">8</option> 
     <option value="9">9</option> 
     <option value="10">10</option> 
     <option value="11">11</option> 
     <option value="12">12</option> 
     <option value="13">13</option> 
     <option value="14">14</option> 
     <option value="15">15</option> 
     <option value="16">16</option> 
    </select> 
    </div> 
</div> 

<div class="form-group"> 
    <label class="col-md-4 control-label" for="desired">select</label> 
    <div class="col-md-5"> 
    <select id="desired" name="desired" class="form-control"> 
     <option value="1">1</option> 
     <option value="2">2</option> 
     <option value="3">3</option> 
     <option value="4">4</option> 
     <option value="5">5</option> 
     <option value="6">6</option> 
     <option value="7">7</option> 
     <option value="8">8</option> 
     <option value="9">9</option> 
     <option value="10">10</option> 
     <option value="11">11</option> 
     <option value="12">12</option> 
     <option value="13">13</option> 
     <option value="14">14</option> 
     <option value="15">15</option> 
     <option value="16">16</option> 
    </select> 
    </div> 
</div> 
+1

Вам нужно Javascript или JQuery для этого. что ты уже испробовал? – Alex

+0

@memelords Проверьте [this] (http://jsfiddle.net/Kri4shna/amvL3hmx/) скрипку, это то, что вы хотите? – Webruster

+0

, вам нужно объяснить свой вопрос дальше. Вы пытаетесь динамически присваивать значения цен выпадающему списку? –

ответ

0

создать текстовое поле с идентификатором цена

<script src="http://code.jquery.com/jquery-1.11.3.min.js" type="text/javascript"></script> 
<script type="text/javascript"> 
$(function(){ 
    $("#current").on('change',function(){ 
     $("#price").val($(this).val()); 
//     you can see values in console also 
       console.log("Price :"+$(this).val()); 

    }); 
}); 

попробовать это один

+0

Мне кажется, мне нужно изучить js, прежде чем возиться с этим. Если это не легче, чем кажется. – memelords

+0

Да, его не так сложно, только любые последние js включают его. используйте идентификатор или класс селектора, используя # или. (Точка) –