动态显示文本

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(); 
    } 
});