我已经创建了一个功能,供用户选择一个时间段,并在选定时间的基础上获得折扣,但现在的问题是,当用户选择第一个,然后选择第二个选项的数量不断得到扣除,而不是从原来的价格重新计算,而不是减少价格检查按钮是否被点击做别的什么也不做什么
这里是我工作的代码
$(document).ready(function(e) {
\t $('.time-slot').on('click', function() {
\t \t $('.time-slot').removeClass('active1');
\t \t $(this).addClass('active1');
\t \t
\t \t var dt_time \t = $(this).attr('data-dt-time');
\t \t var time_off \t = $(this).attr('data-timeoff');
\t \t var cost \t \t = $('.price').val();
\t \t
\t \t if(time_off !== undefined) {
\t \t \t if($('.time-slot').hasClass('active1')) {
\t \t \t \t var subtr \t = parseInt(cost)/100 * parseInt(time_off);
\t \t \t \t var subtotal = parseInt(cost) - subtr;
\t \t \t \t $('.price').val(subtotal);
\t \t \t } else {
\t \t \t \t var subtr \t = parseInt(cost)/100 * parseInt(time_off);
\t \t \t \t var subtotal = parseInt(cost) + subtr;
\t \t \t \t $('.price').val(subtotal);
\t \t \t }
\t \t }
\t \t
\t });
});
li {
cursor:pointer;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<ul>
<li class="time-slot" data-dt-time="08:00" data-timeoff="10">08:00</li>
<li class="time-slot" data-dt-time="08:30" data-timeoff="15">08:30</li>
<li class="time-slot" data-dt-time="09:00" data-timeoff="10">09:00</li>
<li class="time-slot" data-dt-time="09:30" data-timeoff="20">09:30</li>
<li class="time-slot" data-dt-time="10:00" data-timeoff="10">10:00</li>
</ul>
<input type="text" class="price" value="350" />