2017-09-02 77 views
0

我已经创建了一个功能,供用户选择一个时间段,并在选定时间的基础上获得折扣,但现在的问题是,当用户选择第一个,然后选择第二个选项的数量不断得到扣除,而不是从原来的价格重新计算,而不是减少价格检查按钮是否被点击做别的什么也不做什么

这里是我工作的代码

$(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" />

回答

1

我得到你的解决方案,你重写价格类的价值。我在这里使用了一个新的输入类名称originalPrice。我得到产地成本的价格从originalPrice并将其发送到价格和执行你的行动,你想要什么

$(document).ready(function(e) { 
 
    $('.time-slot').on('click', function() { 
 
    $('.time-slot').removeClass('active1'); 
 
    $(this).addClass('active1'); 
 

 
    var dt_time = $(this).attr('data-dt-time'); 
 
    var time_off = $(this).attr('data-timeoff'); 
 
    var cost = $('.originalPrice').val(); 
 

 
    if (time_off !== undefined) { 
 
     if ($('.time-slot').hasClass('active1')) { 
 
     var subtr = parseInt(cost)/100 * parseInt(time_off); 
 
     var subtotal = parseInt(cost) - subtr; 
 
     $('.price').val(subtotal); 
 
     } else { 
 
     var subtr = parseInt(cost)/100 * parseInt(time_off); 
 
     var subtotal = parseInt(cost) + subtr; 
 
     $('.price').val(subtotal); 
 
     } 
 
    } 
 

 
    }); 
 
});
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="originalPrice" value="350" /> 
 
<input type="text" class="price" value="350" />

0

线后右

$(document).ready(function(e) { 

添加变量声明

var cost = 350 

和使用,在你的计算,而不是直接从价格字段拿起成本。