kynetxのjQuery UIエフェクト

Question

KynetxのjQuery UI統合を使用して、ページ上でjQuery UIエフェクトが正常に実行されました。

しかし、私はサイドタブ内で作業する効果が得られません。私のアプリケーションのルールは次のとおりです。私は誰かが私が行方不明です何を指摘することができます願っています：私は私のメタタグに

use javascript resource jquery_ui_js 

が含まれていることを確認作ら

global { 
    css << 
     #tester 
     { 
      margin-left: 10px; 
      margin-top: 10px; 
      width: 80px; 
      height: 80px; 
      background: green; 
      position: relative; 
     } 
     >>; 
} 

rule tab is active { 
select when pageview ".*" setting() 

pre { 
     results = << 
      <div id='tester'></div> 
      >>;   
} 
{ 
    sidetab() with pathToTabImage = "http://dl.dropbox.com/u/10762217/search-tab-images/tab2.png" 
       and tabColor = "transparent" 
       and topPos = "50px" 
       and message = results 
       and divCSS = { 
          "z-index": 10000, 
          "backgroundColor": "#ffffff", 
          "width": "200px", 
          "padding": "0px", 
          "imageHeight": "162px", 
          "imageWidth": "53px", 
          "-moz-border-radius": "5px" 
          }; 
       watch("#tester", "click"); 
      } 



} 



rule jeffect_on_click is active { 
    select when web click "#tester" 
     jquery_ui:effect("#tester","bounce","normal"); 


} 
} 

。

Answer 1

あなたは何も欠けていません。現在、ランタイム、具体的にはwatch()アクションは.live()を使用してイベントハンドラを登録します。 sidetab()は、.live()で接続されたすべてのイベントハンドラを食べます。 .live()はdocumentオブジェクトにクリックハンドラをアタッチして実際に動作し、イベントがバブルアップするのを監視するため、sidetab()がそれらを食べます。 documentに到達すると、セレクタに一致する要素からイベントが登録されているかどうかがチェックされます。存在する場合は、ハンドラが起動されます。 sidetab()はevent.stopPropagation()を呼び出すことでこれを無効にします。これによりイベントのバブリングが停止し、documentに決して到達しないため、ハンドラーは決して起動しません。

これは、イベントハンドラをjQueryユーティリティ関数.bind()に登録することで解決できます。 .bind()は、すでに存在する要素のハンドラのみを登録しますが、サイドタブ内の要素が存在する場合は、の前にの前に.bind()と呼んでください。このような

何か：

$K("#tester").bind("click", function() { 
    $K(this).effect("bounce", { "times" : 3 }, 300); 
}); 

我々は、のは、アプリケーション全体の文脈の中でそれを置くものとしましょうか？

この例を単純にするために、emitハンドラを添付してクリックしたときにdivがバウンスするのに必要なjavascriptを使用します。この例も​​です。

ruleset a369x111 { 
    meta { 
     name "Sidetab->Events" 
      description << 
       Sidetab jQuery 
      >> 
      author "AKO" 
      logging on 

      use javascript resource jquery_ui_js 

    } 
    global { 
     css << 
      #tester { 
       margin-left: 10px; 
       margin-top: 10px; 
       width: 80px; 
       height: 80px; 
       background: green; 
       position: relative; 
      } 
     >>; 
    } 

    rule tab { 
     select when pageview ".*" 

      pre { 
       results = << 
        <div id="tester"></div> 
       >>;   
      } 
     { 
      sidetab() with pathToTabImage = "http://dl.dropbox.com/u/10762217/search-tab-images/tab2.png" 
       and tabColor = "transparent" 
       and topPos = "50px" 
       and message = results 
       and divCSS = { 
        "z-index": 10000, 
        "backgroundColor": "#ffffff", 
        "width": "200px", 
        "padding": "0px", 
        "imageHeight": "162px", 
        "imageWidth": "53px", 
        "-moz-border-radius": "5px" 
       }; 
       emit <| 
        $K("#tester").bind("click", function() { 
         $K(this).effect("bounce", { "times" : 3 }, 300); 
        }); 
       |>; 
     } 



    } 
}