詳しい人求む！

Backbone.js イベントが効かない

解決済

質問者：i-d-a-i
質問日時：2021/10/19 13:14
回答数：1件

"click li" : "_onClick" のイベントが動作しません。

分かる人いましたら、教えてください。

<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">

<script src="https://code.jquery.com/jquery-2.2.2.js" integrity="sha256-4/zUCqiq0kqxhZIyp4G0Gk+AOtCJsY1TA00k5ClsZYE=" crossorigin="anonymous">
</script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/underscor …
<script src="https://cdnjs.cloudflare.com/ajax/libs/backbone. …

</head>

<body>
<script type="text/template" id="user-template">
<%- name %> <%- age %> 才
</script>

<script>
const Person = Backbone.Model.extend({});

const Users = Backbone.Collection.extend({ model: Person });
const users = new Users();
//データ追加
users.add({ name: "太郎", age: 8 });

// 要素の作成
const span_view = Backbone.View.extend({
tagName: "li",
template: _.template($("#user-template").html()),

events : {
"click li" : "_onClick"
},

_onClick: function() {
console.log('detected');
},

render: function() {

const tpl = this.collection.map( v => this.template(v.attributes) ).join('<br>');

this.$el.html(tpl);

return this;
}
});

const span = new span_view({ collection: users });

// 要素を画面に描画
$("body").html(span.render().el);
</script>
</body>
</html>

通報する

この質問への回答は締め切られました。

質問の本文を隠す

回答 (1件)

No.1ベストアンサー

回答者： fujillin
回答日時：2021/10/19 15:27

こんにちは

例によって、backboneは全く存じませんので、ご提示のソースをそのままコピペしてテストしてみただけですが・・・

そのままだと、body直下にli要素ができてしまうのはご愛嬌として、"click li"イベントってカスタムイベントとして定義してはいないのでは？

通常のマウスクリックを取得したいのものと勝手に解釈するなら、
　"click" : "_onClick"
に変えると、普通のクリックイベントを感知できるようになりますね。

※ もしも”click li"イベントを取得したいのなら、そのイベントを定義しておく必要があるのではないかと推測します。
※ 内容的にまったくわかっていませんので、これ以上はわかりません。
※ ご質問の意味が違っていたなら、スルーしてください。