2009-06-30 6 views
3

最後に、これは私が特に修正する必要がある問題ではないと判断しましたが、なぜそれが起こっているのか分かりません。

基本的にはいくつかのチェックボックスがありますが、ユーザーが特定の数のものを選択できるようにしたいだけです。私はその効果を達成するために、以下のコードを使用しています。


$j(function() { 
    $j('input[type=checkbox].vote_item').click(function() { 
     var numLeft = (+$j('#vote_num').text()); 
     console.log(numLeft); 
     if (numLeft == 0 && this.checked) { 
      alert('I\'m sorry, you have already voted for the number of items that you are allowed to vote for.'); 
      return false; 
     } else { 
      if (this.checked == true) { 
       $j('#vote_num').html(numLeft-1); 
      } else { 
       $j('#vote_num').html(numLeft+1); 
      } 
     } 
    }); 
}); 

そして、私はそれをテストしていたとき、私は私が使用している場合に気づい:


$j('input[type=checkbox]').each(function() { 
    this.click() 
}); 

をJavascriptがで使用した場合、私はしかし、予想通りに反応:


$j('input[type=checkbox]').each(function() { 
    $j(this).click() 
}); 

それはです実際にカウンターをカウントアップさせる。

私は、カウンターを使用してカウントを続けるのが最も安全な方法ではないことを認識していますが、サーバー側のエラーチェックにより、データベースに必要以上の量が入力されない実際に修正する必要はないと私は決めています。

編集:これは単にDOMであるのに対し、$ jは...

答えて

3

カウンタがアップしているという事実は、あなたが使用しているchecked属性とclickイベントを手動で実行するというリンクがあるという手がかりを与えました。

私はGoogleで「jquery checkbox click event raise」を検索し、このリンクを見つけました。著者がまったく同じ問題と彼が使用した回避策に直面しています。サイドノートでは

http://www.bennadel.com/blog/1525-jQuery-s-Event-Triggering-Order-Of-Default-Behavior-And-triggerHandler-.htm

、私はあなたがさらにあなたのコードを簡素化することができると思います。

$j('input[type=checkbox].vote_item').click( 
function() 
{ 
    var maxNumberOfChoices = 5; 

    //get number of checked checkboxes. 
    var currentCheckedCount = $j('input[type=checkbox].vote_item :checked'); 

    if(currentCheckedCount > maxNumberOfChoices) 
    { 
     //It's useful if you show how many choices user can make. :) 
     alert('You can only select maximum ' + maxNumberOfChoices + ' checkboxes.'); 
     return false; 
    } 

    return true; 
}); 
6

$(これは)(機能の多くが付いている)jQueryのラッパーが含まれている私はnoConflictモードでのjQueryを使用する必要があるという事実によるものですオブジェクト。

+0

私はそれを理解しています...機能の違いは何ですか?そしてjQueryは、jQueryでラップされた要素によってトリガされたときに、他のDOMイベントの機能を変更しますか? – Thomas

3

this.click()は、ブラウザDOMメソッドclick()を呼び出します。

$(this).click()は、ブラウザメソッドを呼び出すだけではありません。詳しくは、関数triggerの実装を参照してください。jQueryメソッドを呼び出します。

関連する問題