0

嗨,我有以下HTML模板有没有听HTML元素的样式变化的方式 - Backbone.js的

<li id="imovel" style="<%= display %>"> 
     <div class="thumbnail">      
      <a href="#"> 
      <img src="http://placehold.it/90x60"></img> 
      <%= textvar %> 
      </a> 
     </div>          
    </li> 

显示器是display: nonedisplay: block取决于一些事情。

当我显示我的意思是听在EL风格显示属性更改做change:display我想这个观点

var imovelView = Backbone.View.extend({ 

    el: $('#imovel') 

    ,template: _.template($("#listing_template").html()) 

    ,events: { 
     "change:display #imovel" : "activate" 
    } 

    ,initialize: function(){ 
     this.on('change:display', this.toggle, this); 
     this.collection.bind('add', this.render, this); 
    } 

    ,activate: function(item){ 
     alert("change display"); 
    } 

    ,render: function(item){ 
     var showPerPage = $('#show_per_page').val(); 
     var totalEntries = this.collection.length; 

     var pageMax = Math.ceil(showPerPage/totalEntries); 
     var displayValue = "display: none;"; 

     if(totalEntries <= showPerPage){ 
      displayValue = "display: block;"; 
     } 

     var variables = { textvar: item.get("Lat"), display: displayValue };   
     var template = this.template(variables); 

     $('#max_page').val(pageMax); 
     $('#content').append(template); 
     resizeViewport(); 
    } 

}); 

有没有可能这样做?

+0

为什么不能查看控制隐藏和显示自己? – 2012-02-05 01:42:54

+0

,因为这个逻辑已经工作,我不想惹它。 – 2012-02-05 10:35:37

回答

2

您可以更改代码以触发正在隐藏/显示的元素上的事件吗?这与在设置显示nonde/hide时添加两行一样多。 $(el).trigger('display:changed')上正在改变它的显示状态的元素。然后从Backbone.View只听这个元素上的自定义事件disapearingElement.on('display:changed', doSomething)

任何其他的解决方案将超级麻烦,并在浏览器上加载恒定。你必须创建一个辅助方法,该方法使用setInterval/setTimeout进行轮询,它会一直检查元素的状态,并在更改时触发回调/自定义事件 - 这是实现跨浏览器的唯一方法。

但说实话......不要离开乱码 - 如果是对你罚款,正常 - 但想想谁将会使用此代码工作的人,当你走了:P

+0

不,我不想离开凌乱的代码...将尝试这个自定义事件选项,否则我将重建所有的网站,因为我将不得不维护它:D ...谢谢! – 2012-02-05 19:25:59

+0

不错的选择!尤达会为你感到骄傲:) – 2012-02-05 20:17:29