0

ユーザーがログインする必要があるサイトを構築しました。ログインせずにコンテンツを利用できるようにすることにしましたが、一部の操作ではユーザーが最初にログインする必要があります。このサイトは Javascript に大きく依存しています。ユーザーが何らかのボタンをクリックすると、ログインフォームがポップアップするはずです。

私が計画しているのは、ユーザーがログインしているかどうかを確認するために、必要なボタンでクリック イベントを添付することです。以前のコード:

 $('body').on('click','.editRating',function(){
      // code to edit        
      return false;
   })

これは私が計画しています。ログインを確認するために、必要なボタンにもう 1 つのイベント ハンドラーをアタッチします。

 $('body').on('click','.editRating',function(){
      if user is not loggedIn{
           popup loginForm
           return false
       }        
 })
  $('body').on('click','.editRating',function(){
      // code to edit        
      return false;
   })

それで、これは定義されたのと同じ順序でイベントハンドラーの実行を保証しますか? 目標を達成するためのよりクリーンで安全な方法はありますか?

4

1 に答える 1

1

すべてを 1 つのイベント ハンドラーに入れることができます。

$('body').on('click','.editRating',function(){
    if user is not loggedIn{
        popup loginForm
        return false
    }        

    // code to edit        
    return false;
})

それがうまくいかない場合は、イベント処理でキャプチャ フェーズとバブル フェーズを利用して、必要な順序を確実に取得できます。jQuery はバブル フェーズのみを実行すると思います (ただし、もちろん、それについて間違っている場合は修正を歓迎します)。on()したがって、一般的な JavaScript を優先して jQuery を捨てる必要がありますaddEventHandler()

(addEventListener()これは IE 8 以前には存在しないことに注意してください。そのため、これらのブラウザーをサポートする必要がある場合は、チェックしaddEventListener()て、存在しない場合はattachEvent()代わりに使用する必要があります。関連する MDN ドキュメントを参照してください。)

http://jsfiddle.net/WdtsL/は、これを行う方法を示しています (前述の IE 8 サポートを除く)。祖先要素のキャプチャ フェーズ ハンドラはすべて、子要素のバブル フェーズ ハンドラの前に起動します。したがって、ログインをチェックするクリック イベント ハンドラーをbodyタグまたはキャプチャ フェーズの外部コンテナーに配置できます。その後、個々のボタンはバブル段階で通常どおりクリックを処理できます。

HTML の例:

<body id="myBody">
<div id="myDiv">
    Click me!
</div>
</body>​

対応する JavaScript の例:

var myBody = document.getElementById('myBody');
var myDiv = document.getElementById('myDiv');

myDiv.addEventListener('click', function() { alert("Bubbling phase!"); }, false);
myBody.addEventListener('click', function() { alert("Capture phase!"); }, true);
myBody.addEventListener('click', function() { alert("Also a capture phase!"); }, true);
myDiv.addEventListener('click', function() { alert("Oh, hey, I'm bubbling phase!"); }, false);​
于 2012-07-04T14:41:55.133 に答える