Форум

evangelist · #1 (**permalink**) 28.04.2020, 21:52

Здравствуйте.
Не подскажете ли, как добиться, чтобы обойтись без

<option value="0" selected="selected">Select a Payment Method</option>

в этом скрипте?

$("#pay_method").change(function()
{
  $('.payment_method').slideUp();
  switch($('#pay_method :selected').val())
  {
    case '1': $('#cash_payment').slideDown(); break;
    case '2': $('#credit_card_payment').slideDown(); break;
    case '3': $('#debit_card_payment').slideDown(); break;
    case '4': $('#netbanking_payment').slideDown(); break;
  }
});

Т.е. хотелось бы, чтобы при загрузке странички сходу открывался

case '1': $('#cash_payment').slideDown(); break;

, еще до выбора пользователя того или иного селекта, по-дефолту; не могу понять, как сделать.

рони · #2 (**permalink**) 28.04.2020, 22:03

evangelist,

<!doctype html>
<html lang="ru">
<head>
    <meta charset="UTF-8">
    <title>Document</title>
    <style type="text/css">
.payment_method
{
  padding: 10px;
  display: none;
}
#cash_payment
{
  background: lime;
}
#credit_card_payment
{
  background: pink;
}
#debit_card_payment
{
  background: aqua;
}
#netbanking_payment
{
  background: yellow;
}

    </style>
  <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.5.0/jquery.min.js"></script>

  <script>
$(function() {
$("#pay_method").change(function()
{
  $('.payment_method').slideUp();
  switch(this.value)
  {
    case '1': $('#cash_payment').slideDown(); break;
    case '2': $('#credit_card_payment').slideDown(); break;
    case '3': $('#debit_card_payment').slideDown(); break;
    case '4': $('#netbanking_payment').slideDown(); break;
  }
}).val(1).change();
});
  </script>

</head>
<body>
<select id="pay_method" name="pay_method">
  <option value="1">Cash on Delivery</option>
  <option value="2">Credit Card</option>
  <option value="3">Debit Card</option>
  <option value="4">Netbanking</option>
</select>

<div id="cash_payment" class="payment_method">
    You selected <strong>cash</strong> payment method.
</div>
<div id="credit_card_payment" class="payment_method">
    You selected <strong>credit card</strong> payment method.
</div>
<div id="debit_card_payment" class="payment_method">
    You selected <strong>debit card</strong> payment method.
</div>
<div id="netbanking_payment" class="payment_method">
    You selected <strong>netbanking</strong> payment method.
</div>
</body>
</html>

Форум

Справочник

Discord чат

Курсы javascript