jqueryの加減算を制御する方法は？

Question

私はボタンでカウントクリックをやろうとしていると私は.kisi-sayi-text値は追加しない= 0であるが、何も私のコード

HTML

<div class="count-box yetiskin-count"> 
     <span class="count-text">Yetişkin:</span> 
     <span class="kisi-down"></span> 
     <span class="kisi-sayi-text">1</span> 
     <span class="kisi-up"></span> 
    </div> 

jQueryの

に起こっていない場合であればelse文を追加したいです

$('.yetiskin-count > .kisi-up').on("click",function(){ 
    var topParents = $(this).parents(".yetiskin-count"), 
     kisiSayiText = topParents.find(".kisi-sayi-text"), 
     kisiSayiNumber = kisiSayiText.html(parseInt($(".kisi-sayi-text").html())+1); 

    if(kisiSayiNumber<0){ 
     return false; 
    } 
}); 

Answer 1

それはなりますので、それは減算を扱うように、あなたは.kisi-downクリックハンドラーをご覧くださいそれは0

$('.yetiskin-count > .kisi-up').on("click",function(){ 
 
    var topParents = $(this).parents(".yetiskin-count"), 
 
     kisiSayiText = topParents.find(".kisi-sayi-text"), 
 
     kisiSayiNumber = parseInt($(".kisi-sayi-text").html()); 
 
    kisiSayiText.html(kisiSayiNumber + 1); 
 
}); 
 

 
$('.yetiskin-count > .kisi-down').on("click",function(){ 
 
    var topParents = $(this).parents(".yetiskin-count"), 
 
     kisiSayiText = topParents.find(".kisi-sayi-text"), 
 
     kisiSayiNumber = parseInt($(".kisi-sayi-text").html()); 
 
    if(kisiSayiNumber <= 0){ 
 
     return false; 
 
    } 
 
    kisiSayiText.html(kisiSayiNumber - 1); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div class="count-box yetiskin-count"> 
 
     <span class="count-text">Yetişkin:</span> 
 
     <span class="kisi-down">&lt;</span> 
 
     <span class="kisi-sayi-text">1</span> 
 
     <span class="kisi-up">&gt;</span> 
 
    </div>

に達したときに引い停止この比較：

をこれで

$('.yetiskin-count > .kisi-up').on("click",function(){ 
    var topParents = $(this).parents(".yetiskin-count"), 
     kisiSayiText = topParents.find(".kisi-sayi-text"), 
     kisiSayiNumber = kisiSayiText.html(parseInt($(".kisi-sayi-text").html())+1); 

    // kisiSayiNumber is a jQuery object, not a number so there is no point comparing it with 0 
    if(kisiSayiNumber<0){ 
     return false; 
    } 
}); 

：

$('.yetiskin-count > .kisi-up').on("click",function(){ 
    var topParents = $(this).parents(".yetiskin-count"), 
     kisiSayiText = topParents.find(".kisi-sayi-text"), 
     kisiSayiNumber = parseInt(kisiSayiText.html()); 

     // if the current running number is less than or equal to 0 then don't add 
     if (kisiSayiNumber <= 0) 
      return false; 
     kisiSayiText.html(kisiSayiNumber + 1); 
}); 

Answer 2

このラインを交換してください

kisiSayiNumber = kisiSayiText.html(parseInt($(".kisi-sayi-text").html())+1); 

kisiSayiNumber = kisiSayiText.html(parseInt($(".kisi-sayi-text").text())+1); 

と

と私はまた、あなたが望むように開始されますあなたは持っている問題は.kisi-upクリックイベント内ではありません

Answer 3

問題は、あなたの<span class="kisi-up"></span>で..ですいくつかのデータを入れてみてください。例えば

<span class="kisi-up">Click Me</span>

あなたはスパンをクリックすることはできませんのでkisi-up

$('.yetiskin-count > .kisi-up').on("click",function(){ 
 
    var topParents = $(this).parents(".yetiskin-count"), 
 
     kisiSayiText = topParents.find(".kisi-sayi-text"), 
 
     kisiSayiNumber = kisiSayiText.html(parseInt($(".kisi-sayi-text").html())+1); 
 

 
    if(kisiSayiNumber<0){ 
 
     return false; 
 
    } 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div class="count-box yetiskin-count"> 
 
     <span class="count-text">Yetişkin:</span> 
 
     <span class="kisi-down"></span> 
 
     <span class="kisi-sayi-text">1</span> 
 
     <span class="kisi-up">Click Me</span> 
 
    </div>

Answer 4

$('.yetiskin-count > .kisi-up').on("click",function(){ 
 
    
 
    var topParents = $(this).parents(".yetiskin-count"); 
 
    var kisiSayiText = topParents.find(".kisi-sayi-text"); 
 
     if($(".kisi-sayi-text").html()<=0){ 
 
     return false; 
 
    }; 
 
     kisiSayiNumber = kisiSayiText.html(parseInt($(".kisi-sayi-text").html())+1); 
 

 
     
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div class="count-box yetiskin-count"> 
 
     <span class="count-text">Yetişkin:</span> 
 
     <span class="kisi-down"></span> 
 
     <span class="kisi-sayi-text">1</span> 
 
     <span class="kisi-up">click here</span> 
 
    </div>

こんにちは、 クリックすると、JQueryライブラリが含まれていることを確認するには、スパンタグにいくつかのコンテンツが必要です。スニペットを実行して機能をチェックすることができます。 これがあなたの問題を解決することを願っています。幸せなコーディング!!!