2013-07-29 2 views
3
<!DOCTYPE HTML > 
<html> 
<head> 
    <meta charset="UTF-8"> 
    <title>Title</title> 
</head> 
<body> 

     <script src="jquery.js"> 
    </script> 

    <script src="underscore.js"> 

    </script> 
    <script src="backbone.js"> 
    </script> 
    <script> 
     var View = Backbone.View.extend({ 

      el: '#listen_to_box', 

      events: { 
       'click [type="checkbox"]':'clicked', 
      }, 
     clicked : function(event) { 
      console.log("events handler for "+ this.el.outerHTML); 
     } 
    }); 

    </script> 

    <div id="listen_to_box"> 
     <input type="checkbox" /> 
    </div> 

</body> 
</html> 

Функция clicked не вызывается, когда я нажимаю этот флажок, пожалуйста, помогите мне связать функцию прослушивания для события click на флажке. СпасибоBackbone view click checkbox listener

ответ

2

Ваша проблема в том, что вы проходите в el, когда вы определяете свой класс View, вместо того чтобы передавать его, когда вы создаете экземпляр класса View. Попробуйте это вместо:

var View = Backbone.View.extend({ 
    events: { 
     'click [type="checkbox"]': 'clicked', 
    }, 
    clicked: function (event) { 
     console.log("events handler for " + this.el.outerHTML); 
    } 
}); 

// Pass in el when instantiating the view 
new View({ 
    el: $("#listen_to_box") 
}); 

См. working fiddle here.

+0

Его еще не работает :( –

6

Вы код выглядит идеально. Вы определили Backbone View под названием View, и события подключены при попытке создать новый экземпляр в представлении. Поэтому событие никогда не подключено.

Просто создайте новый экземпляр, и ваш код должен работать.

var view = new View();илиnew View() должны сделать

Check Fiddle

Вы код выполняется до того, как элемент встречается на странице. Для того, чтобы сделать его работу вам необходимо либо переместить код непосредственно перед закрывающим тегом или упаковывают код внутри Document Ready handler

$(function() { 
    // Your code here 
}); 
+0

Я пробовал, все еще не работает :(ничего не печатается на консоли при щелчке по галочке :(Пожалуйста, помогите мне с этим. –

+3

Похоже, ваш скрипт запускается до того, как элемент присутствует на экране .. Закрепите свой код внутри 'document.ready 'event –

+0

Спасибо, что так много Сушант, его работа сейчас :) Большое спасибо :) –

0
change to 
clicked: function (event) { 
    console.log("events handler for " + this.$el.outerHTML); 
} 

посмотреть, если это помогает