URL кнопки для изменения на основе 2 выпадающих комбинаций выбора - PullRequest
0 голосов
/ 27 сентября 2019

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

т.е.1-й выпадающий: синий, красный, желтый 2-й выпадающий: автомобиль, мяч, дом

Если пользователь выбирает синий и шар, то URL-адрес кнопки меняется на www.blueball.com Если пользователь выбирает синий и дом, то URL-адрес кнопки меняется на www.bluehouse.com....

это самое близкое, что я могу сделать, но вместо отображения текста мне нужно, чтобы он ссылался на разные URL.

(function () {

  $(".go-btn").on(
    'click', 
     function (e) {
       // within this function you should figure out the url
       // to redirect to, depending on the selected values
       // the next line only shows the text of selected values
       $('#selected').html([$('#select1 option:selected').text(), 
                            $('#select2 option:selected').text()].join('/'));
  });

}());
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.0/jquery.min.js"></script>

<div class="selCont">

  <h2>pick an option</h2>

  <select id="select1">
    <option value="1" selected>West</option>
    <option value="2">East</option>
    <option value="3">North</option>
    <option value="4">South</option>
  </select>

  <select id="select2">
    <option value="1" selected>Winter</option>
    <option value="2">Spring</option>
    <option value="3">Summer</option>
    <option value="4">Fall</option>
  </select>

  <button class="go-btn" type="submit">Go</button>

</div>
<div id="selected"></div>

рабочий JSfiddle https://jsfiddle.net/td3j5frn/

Вот еще один пример, который я нашел в Интернете и который выглядит правильно, но кнопка неправильно связывается.

    function myFunction() {

$('.dropdown-plans').change(function() {
    var val = $('#basic_plan').val() + $('#basic_plan2').val();
    var linknum = "";
    switch (val) {
        case "1A" : linknum = "1";
            break;
        case "1B" : linknum = "4";
            break;
    }
    $('#abc').attr("href","www.link" + linknum + ".com");
});

      }
<div class="dropdown-plans">
    <select id="basic_plan" name="bill_cycle">
        <option value="1">1</option>
        <option value="2">2</option>
        <option value="3">3</option>
    </select>
</div>
<div class="dropdown-plans">
    <select id="basic_plan2" name="bill_cycle2">
        <option value="A">A</option>
        <option value="B">B</option>
        <option value="C">C</option>
    </select>
</div>
<div class="button-plans">
<a id="abc" href="something"> Order now </a>
</div>

работает JSfiddle https://jsfiddle.net/errypkpc/1/

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...