Переместить логику расчета в отдельную функцию. И называйте это всякий раз, когда вам нужно пересчитать.
Ваша логика пошла правильно. Атрибуты данных хороши здесь. Там вы можете хранить некоторые метаданные на кнопках, таких как «Счета в месяц», чтобы при обработке клика вы могли получать данные из элемента и пересчитывать обновленные данные.
Я обновил вашу скрипку кнопками типа обработки и отдельной логикой пересчета
$(document).ready(function() {
var price = 21;
var $buttonPlus = $('.increase-btn');
var $buttonMin = $('.decrease-btn');
var $quantity = $('.quantity');
var $paymentType = $('.payment-type');
var $checkout = $(".checkout");
$checkout.on("input", ".quantity", function() {
recalc();
})
/*For plus and minus buttons*/
$buttonPlus.click(function() {
$quantity.val(parseInt($quantity.val()) + 1).trigger('input');
recalc();
});
$buttonMin.click(function() {
$quantity.val(Math.max(parseInt($quantity.val()) - 1, 0));
recalc();
});
$paymentType.click(function() {
var $btn = $(this);
price = $btn.data('price');
$('#period').text($btn.data('period'));
$paymentType.removeClass('btn-info');
$btn.addClass('btnHover');
recalc();
});
function recalc() {
var quantity = +$quantity.val();
$("#total").text("$" + price * quantity);
}
})
.btnHover:hover {
background-color:#17a2b8;
color:white;
}
.priceTitle {
font-weight: 700;
font-size: 15px;
color: #6bde9f;
text-align: center;
}
.pricing {
font-size: 65px;
font-weight: 400;
color: #6bde9f;
}
<head>
<title>Bootstrap Example</title>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.1.3/css/bootstrap.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.3/umd/popper.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.1.3/js/bootstrap.min.js"></script>
</head>
<body>
<!--Yearly/Monthly Buttons-->
<div class="container" style="margin-top:50px;">
<center><div class="btn-group">
<button style="font-weight:bold;" id="yearly" type="button" class="btn btn-info payment-type" data-price="21" data-type="year">Billed Yearly</button>
<button type="button" id="monthlyBtn" class="btn btnHover payment-type" data-price="23" data-type="month">Billed Monthly</button>
</div></center>
</div>
<br>
<!--Calculation section-->
<div class="col-sm-12 col-md-4 checkout">
<div style="margin-bottom:-25px;">
<p class="price priceTitle" data-price="21">COMPANY</p>
</div>
<div class="row" style="padding-left:100px;">
<div class="col-6" style="height:50px;">
<p class="total pricing" style="float:right; margin-right:-15px;"><span id="total">$21</span></p>
</div>
<div class="col-6" style="height:90px;">
<p style="font-size:12px; margin-top:40px; margin-left:-12px;">per<br> <span id="period">month</span></p>
</div>
</div>
<center><div>
<p style="font-size:12px; margin-bottom:5px;">People on your team</p>
<button type="button" class="btn decrease-btn">-</button>
<input style="width:70px; text-align:center; padding-bottom:5px" type="text" class="rounded quantity" value="1"/>
<button type="button" class="btn increase-btn">+</button>
</div></center>
</div>
</body>
static
указатели автоматически инициализируются к NULL
. Посмотрите C99:TC3 6.7.8, §10:
Если объект, который имеет продолжительность автоматического хранения, не инициализируется явно, ее значение неопределенно. Если объект, который имеет статическую продолжительность хранения, не инициализируется явно, то:
- если это имеет тип указателя, это инициализируется к нулевому указателю;
- если это имеет арифметический тип, это инициализируется к (положительный или неподписанный) нуль;
- если это - агрегат, каждый участник инициализируется (рекурсивно) согласно этим правилам;
- если это - объединение, первый именованный участник инициализируется (рекурсивно) согласно этим правилам.
Кроме того, вопреки тому, что другие записали,
memset(array, 0, sizeof(array));
как гарантируют, не приведет к нулевым указателям. В некоторых системах, указателе со всем его набором битов к 0
могло бы на самом деле быть допустимым. Для основных систем это не имеет место, но со встроенными системами, каждый никогда не знает.
Безопасный способ установить все записи в нулевого указателя состоит в том, чтобы или циклично выполниться по записям самостоятельно и установить их на NULL
, или использовать неинициализированное static
массив, который Вы можете memcpy()
по массиву Вы хотите установить на NULL
.
static void* array[1024] = {0};
или, поскольку kmkaplan указывает в комментарии, просто:
static void* array[1024];
хотя я предпочитаю первое решение только, чтобы напомнить мне, что оно установлено на нули (компилятор не должен генерировать код для этого, если это не является глупым).
Вам не нужен к memset он вообще, так как переменные уровня файла инициализируются для обнуления так или иначе.
Если необходимо сбросить их к ПУСТЫМ УКАЗАТЕЛЯМ в какой-то момент после запуска, используйте:
memset(array, 0, sizeof(array));
Это работает над большинством платформ (все, кого я когда-либо видел, и это довольно много), так как нулевой указатель является обычно нулевыми битами. Но стандарт не гарантирует это так на тех неясных платформах, более безопасно сделать:
for (i = 0; i < sizeof(array) / sizeof(void*); i++)
array[i] = NULL;
Все, в чем Вы нуждаетесь:
static void* array[1024];
потому что статические переменные инициализируются к 0 так или иначе, таким образом, Вы не должны действительно инициировать этот массив, это произойдет автоматически.
memset сделает это во времени выполнения.
static void* array[1024] = {0};
предложенный Миром сделает это во время компиляции, и это увеличит размер исполняемого файла.
Для библиотеки я полагаю, что memset является более соответствующим.
Нет, это неправильно. Вы не рассматриваете размера каждого элемента.
memset(array, 0, sizeof(array)); // this works only on static arrays.
Обычно необходимо использовать:
memset(array_reference, 0, size_of_array * sizeof(array_element_type));