gpt4 book ai didi

javascript - Backbone.js:使用输入文件更改模型

转载 作者:行者123 更新时间:2023-11-28 08:02:48 24 4
gpt4 key购买 nike

我尝试使用主干事件来设置 </input type="file" />按钮,但如果我在模型内设置它,它就不起作用。我知道这是因为对象的绑定(bind)事件,但我不知道如何解决这个问题。我需要做的就是使用按钮 id 选择的新路径来更改 localStorage 值,但我就是无法让它工作。

有什么想法吗?

这是我的代码:

app.js

var TodoItem = Backbone.Model.extend({
defaults: {
somepath: window.location.pathname,
status: "incomplete",
id: 1
},
urlRoot: "/todos",
toggleStatus: function(e){

<!-- THIS IS NOT SHOWING ANYTHING -->
console.log(e);
<!-- END COMMENT -->

if(this.get('status') === 'incomplete'){
this.set({'status': 'complete'});
this.set({'somepath': window.location.pathname + 'xxxxx' });
} else {
this.set({'status': 'incomplete'});
this.set({'somepath': window.location.pathname })
}
this.save();
},
localStorage: new Backbone.LocalStorage("button")
});

var TodoView = Backbone.View.extend({
tagName: 'article',
id: 'todo-view',
className: 'todo',

template: _.template( $('#personTemplate').html() ),

events: {
"change input": "toggleStatus"
},

toggleStatus: function () {
this.model.toggleStatus();
},

remove: function(){
this.$el.remove();
},

initialize: function(){
// this.render();
this.model.on('change', this.render, this);
this.model.on('destroy', this.remove, this);
},

render: function () {
var attributes = this.model.toJSON();
this.$el.html(this.template(attributes));
}
});

var todoItem = new TodoItem;
var todoView = new TodoView({ model: todoItem });


todoView.render();
$(document.body).append(todoView.el);

<!-- ONLY THIS CODE WORKS. ALSO IF I JUST ADD THE FUNCION OF THE EVENT INSIDE THE VIEW -->
// document.getElementById('wat').addEventListener('change', function (e) {
// console.log(e.target.value);
// });
<!-- END COMMENT -->

index.html

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Project 1</title>
<meta name="viewport" content="user-scalable=no, width=device-width, initial-scale=1, maximum-scale=1, height=device-height, target-densitydpi=device-dpi">

<link rel="stylesheet" type="text/css" href="css/style.css"/>
</head>
<body>

<ul id="elem">
</ul>

<script id="personTemplate" type="text/template">
<h3 class="<%= status %>"><input type="file" id="wat"<% if (status === "complete") print("checked") %> />
<%= description %></h3>
</script>

<script type="text/javascript" src="js/jquery.js"></script>
<script type="text/javascript" src="js/underscore.js"></script>
<script type="text/javascript" src="js/backbone.js"></script>
<script type="text/javascript" src="js/backbone-localstorage.js"></script>
<script type="text/javascript" src="js/app.js"></script>

</body>
</html>

最佳答案

如果我理解得很好,您就缺少将 e 参数传递给模型方法。

在 TodoView 内部,方法 toggleStatus 应该如下所示:

toggleStatus: function (e) {
this.model.toggleStatus(e);
},

关于javascript - Backbone.js:使用输入文件更改模型,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/25190977/

24 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com