javascript - BackBone View 事件哈希

Question

我是 Backbone 新手，正在做一个自学项目。由于某种原因，我无法让事件哈希起作用，所以我在初始化函数中做了很多事情。我将如何在下面的 View 中使用事件哈希？

var PictureView = Backbone.View.extend({
    el: "#app",

    initialize: function() {

        $('.button').click(function() {
            this.request();
        }.bind(this))
    },

    request: function(text) {

        var text = $('#text').val();

        this.getPicture(text, function(url) {
            console.log(arguments)
            //append it to the image tag;
            $("#random").attr("src", url)
        });
    },

    getPicture: function(tags, cb) {



        $.getJSON(
            "https://api.flickr.com/services/rest/?jsoncallback=?", {
                method: 'flickr.photos.search',
                tags: tags,
                api_key: apiKey,
                format: 'json',
                nojsoncallback: 1,
                per_page: 10 // you can increase this to get a bigger array
            },
            function(data) {


                if (data.stat === 'ok') {

                    var photo = data.photos.photo[Math.floor(Math.random() * data.photos.photo.length)];


                    $.getJSON(
                        "https://api.flickr.com/services/rest/?jsoncallback=?", {
                            method: 'flickr.photos.getSizes',
                            api_key: apiKey,
                            photo_id: photo.id,
                            format: 'json',
                            nojsoncallback: 1
                        },
                        function(response) {
                            console.log(response);

                            if (response.stat === 'ok') {

                                var the_url = response.sizes.size[5].source;
                                cb(the_url);
                            } else {
                                console.log(" The request to get the picture was not good :\ ")
                            }
                        }
                    );

                } else {

                    alert("no pictures found for that tag :'(");
                }
            }
        );
    }
})

Answer 1

您的按钮位于 ID 为 #app 的 div 之外。在 Backbone 中，为了使事件哈希发挥作用，您想要使用事件的元素应该位于您的 el 内部。

<center><div id="app">
 <center><button class="button">Click Me to add an image</button</center>
</div></center>

现在您可以使用事件哈希作为

el: "#app",

events: { 'click .button': 'request' },

initialize : function(){}