引導按鈕; JavaScript的

Question

我有我的形式這段代碼：

<a onclick="discount()"><button class="btn btn-primary" style="background-color:#92CD00; color:black">Discount</button></a> 

折扣功能由給定值降低了價格。

當我點擊按鈕，discount()執行，但它會立即閃回原始值！爲什麼？請告訴我，如果我正在執行按鈕。

Answer 1

你可以分開你的功能（內容，行爲，樣式），並用jQuery綁定你的按鈕行爲。

CSS（樣式）：

#btn_discount { 
    background-color: #92CD00; 
    color: black; 
} 

HTML（含量）：

<button id="btn_discount" class="btn btn-primary">Discount</button> 

JS（行爲）：

$(document).ready(function() { 
    $("#btn_discount").click(
     var current_price = my_app.get_price(); 
     var discount_value = my_app.get_discount(); 
     var new_price = my_app.discount(current_price, discount_value); 
     my_app.set_price(new_price); 
    ); 
}); 

var my_app = { 
    price: 0, 
    discount: 0, 
    get_price: function() { 
     return this.price; 
    }, 
    set_price: function(new_price) { 
     this.price = new_price; 
    }, 
    get_discount: function() { 
     return this.discount_value; 
    }, 
    set_discount: function(new_discount_value) { 
     this.discount = new_discount_value; 
    }, 
    discount: function(price, value) { 
     var reduced_price; 
     .... 
     return reduced_price; 
    } 
};