在骨干鉴于埃尔外部访问的单击事件 [英] Access click event outside the el in backbone view

查看:156
本文介绍了在骨干鉴于埃尔外部访问的单击事件的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我如何可以访问点击范围之外的事件。

How can i access click event outside the el scope.

我有:
HTML:

What i have : HTML :

<div class="right_btn"></div>
<div id="template_loader">
    <!-- HTML template goes here which contain form inputs-->
    <input type="text" class="forgot_password_email" name="forgot_password_email"/>
</div>

查看:

var ForgotPasswordView = Backbone.View.extend({
    el: "#template_loader",
    initialize: function () {
        console.log('Forgot Password View Initialized');
    },
    render: function () {
        blockPage();
        var that = this;  

        $.get(App.baseUrl + 'templates/forgot-password-view.html', function (data) {
            template = _.template(data, { });
            that.$el.html(template);
            unblockPage();
        }, 'html'); 
    },
    events:{
        'click .right_btn':'forgotPasswordSubmit', //Doesn't fire as its outside of el
    }, 
    forgotPasswordSubmit: function(e){
        alert($(".forgot_password_email").val());
        e.preventDefault();
    }
});

香港专业教育学院通过了如下:

Ive gone through the following :

<一个href=\"http://stackoverflow.com/questions/8274257/backbone-js-views-binding-event-to-element-outside-of-el\">Backbone.js观点 - 结合事件元素的&QUOT之外; EL&QUOT;

<一个href=\"http://stackoverflow.com/questions/13269071/howto-bind-a-click-event-in-a-backbone-subview\">Howto绑定中的骨干一个点击事件子视图

但并不能真正帮助我得到它的工作。

but doesn't really help me get it to work.

我如何获得 .right_btn 的视图中点击事件。我不能改变模板结构包含 right_btn 埃尔内。在这里反正外面的元素绑定或识别骨干网内部的单击事件查看本身。

How can i get the click event of .right_btn inside the view. I cannot change the template structure to include the right_btn inside theel. Is here anyway to bind the outside element or recognize the click event inside a backbone view itself.

推荐答案

其实还有一种方法:

以下是其中有一个主模板和元件template_loader内部,forgotpassword模板是渲染原始视图。按钮 right_btn 之外的元素的范围,并没有开火。

The following is the original view which have a main template and inside the element template_loader, the forgotpassword template is renderer. The button right_btn is outside the elements scope and it did not fire.

var ForgotPasswordView = Backbone.View.extend({
    el: "#template_loader",
    initialize: function () {
        console.log('Forgot Password View Initialized');
    },
    render: function () {
        blockPage();
        var that = this;  

        $.get(App.baseUrl + 'templates/forgot-password-view.html', function (data) {
            template = _.template(data, { });
            that.$el.html(template);
            unblockPage();
        }, 'html'); 
    },
    events:{
        'click .right_btn':'forgotPasswordSubmit', //This will fire.
    }, 
    forgotPasswordSubmit: function(e){
        alert($(".forgot_password_email").val());
        e.preventDefault();
    }
});

所以,大量的研究后,我发现了一个解决我的问题。林不知道这是否有任何激烈的问题。我还没有遇到任何事情,如果我发现任何东西我会更新这个帖子:

So after a lot of research, i found a solution to my problem. Im not sure whether this has any drastic problems. I have not encountered anything yet and i will update this post if i find anything :

的想法创造了同样的观点一个新的实例,但是这一次与另一个埃尔。通过这种方式,我们得到执行初始化,并与第一 EL渲染功能,并使用下一个的事件。

The idea to create a new instance for the same view, but this time with another el. By this way, we get to execute the initialize and render functions with the first el and use the next one for the events.

一个缺点是,你将无法使用类似这个获得第一个 peoperties。但由于我使用jquery,我可以用选择通过这个来获得。除此之外,我没有发现任何问题...但!

One downside is that you will not be able to use something like this to obtain first el peoperties. But since i am using jquery, i can use the selectors to get through this. Other than that, i did not find any issues... yet.!

new ForgotPasswordView ({
   el:'#master_template'
});

这篇关于在骨干鉴于埃尔外部访问的单击事件的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆