動態顯示文本

Question

我有一個簡單的形式，它看起來像這樣：

Team 1 
<input type='button' value='-' class='qtyminus' field='quantity' /> 
<input type='text' name='quantity' value='0' class='qty' readonly /> 
<input type='button' value='+' class='qtyplus' field='quantity' /> 

Team 2 
<input type='button' value='-' class='qtyminus' field='quantity2' /> 
<input type='text' name='quantity2' value='0' class='qty' readonly /> 
<input type='button' value='+' class='qtyplus' field='quantity2' /> 

當球隊之一，已成立3號我希望出現的那支球隊的名字動態下面。像「Team1/Team 2是勝利者！」。而當我更改團隊名稱旁邊的數字時，我希望文本「Team1/Team2是勝利者！」消失。

Answer 1

$('.qty').on('change', function(){ 
    if($(this).val() == 3){ 
    // do this 
    } 
    else { 
    // do the other thing 
    } 
}) 

Answer 2

假設你有某種股利與要顯示和隱藏這樣的消息：

<div class="message" style="display:none;">Team 1 is the winner!</div>

您可以使用jQuery針對那些按鈕，聽像一點擊事件這樣的：

$('.qtyminus, .qtyplus').click(function(){...}); 

然後click()回調函數中，你可以處理檢查：

$('.qtyminus, .qtyplus').click(function(){ 
    var score = $(this).siblings(".qty"); 
    if($(this).hasClass("qtyplus")){ 
    $(score).val(parseInt($(score).val())+1); 
    } 
    else{ 
    $(score).val(parseInt($(score).val())-1); 
    } 

    if($(score).val()==3){ 
    $('.message').show(); 
    } 
    else{ 
    $('.message').hide(); 
    } 
});