backbone.jsを使用したイベント

基本的なbackbone.jsの設定を試行中です - 起動するイベントを取得できません。私は何が欠けていますか？backbone.jsを使用したイベント

HTML

<html lang="en"> 
<head> 
    <script type="text/javascript" src="js/libs/jquery/jquery-1.6.4.min.js"></script> 
    <script type="text/javascript" src="js/libs/underscore/underscore-min.js"></script> 
    <script type="text/javascript" src="js/libs/backbone/backbone.js"></script> 
    <script type="text/javascript" src="js/test.js"></script> 

    <title></title> 
</head> 

<body> 
    <div id="helloworld"> 
     <button id="sayhello"> 
      Say Hello 
     </button> 
    </div> 
</body>

そしてここでは、JS

(function($) { 

HelloWorldView = Backbone.View.extend({ 

    el : '#helloworld', 

    events: {'click #sayhello': 'onButtonClicked'}, 

    onButtonClicked: function() 
    { 
     console.log("buttonclicked"); 
    }, 

    render : function() { 
     console.log("rendering"); 
     $(this.el).html("Hello world"); 
    } 
}); 

var helloView = new HelloWorldView().render();})(jQuery);

は、私はイベントが火に得ることができない理由を任意のアイデアですか？

出典

2011-10-25 Andrei Taraschuk

あなたrender方法は#sayhelloを殺す：

render : function() { 
    console.log("rendering"); 
    $(this.el).html("Hello world"); // #sayhello is now gone 
}

ようにクリックすると、あなたのイベントハンドラが呼び出されることは決してありません何の#sayhelloはありません。

おそらく、あなたのrenderはもっとこのように見えることになっている：

render: function() { 
     console.log("rendering"); 
     $(this.el).find('button').html("Hello world"); 
}

デモ：http://jsfiddle.net/ambiguous/4empG/

出典

2011-10-25 03:49:08

しかし、それを指摘してくれてありがとう、私はまだonButtonClickedイベントをキャプチャできませんでしたか？ –

@Andrei：デモ（http://jsfiddle.net/ambiguous/4empG/）はうまくいくので、何をやっているのですか？私がデモで行った唯一の変更は、私の答えのような新しいレンダーです。 –

これは奇妙なことですが、JSFiddleにローカルコードを貼り付けるとうまくいきます。そのような運はローカルにない。 HTMLは上記とまったく同じです... –

実際にあなたが（ "Hello World" の
$（this.el）の.htmlで全体のhtmlを交換"こんにちは世界"）;
それはいいです、あなたはボタンを見つけてhtmlを変更するだけです。
this。$（ '＃sayhello'）.html（ 'Hello World'）;

出典

2014-10-16 19:14:42

backbone.jsを使用したイベント

答えて

関連する問題