将事件绑定到div出现

Question

我可以创建一个事件，以便每当具有特定ID的元素变为可见或出现在页面上时，我可以执行一些JavaScript？

元素来自远程资源（所以不是在我的html代码中，但出现在页面加载），我想要一些代码运行时出现（只有它出现时，它可能不会出现每加载）。

谢谢！

Answer 1

您可以将检查每X毫秒，如果这样的元素出现在页面（一个纯JavaScript解决方案）上的功能：

(​function()​ { 
    var intervalId = window.setInterval(function() { 
     if (null != document.getElementById('myDivId')) { 
      // the div appeared on the page 
      // ... do your stuff here: 
      alert('its here!'); 

      // optionally stop checking (obviously it's there already 
      // unless you decide to remove it) 
      window.clearInterval(intervalId); 
     }; 
    }, 100); // perform check every 100 milliseconds 
}​)()​; 

存在这样的可能性，该DIV是那里所有的时间，只不可见。所以，你的检查功能应该是有一点不同：

var el = document.getElementById('myDivId'); 
if (null != el && (el.offsetWidth > 0 || el.offsetHeight > 0)) { 

基本上(el.offsetWidth > 0 || el.offsetHeight > 0)表示该元件不被其或其父母的CSS属性是隐藏的。

Answer 2

如果选择没有找到匹配，它只是将无法运行，所以像这样仅仅有代码是罚款：

$("#elementID").each(function() { 
    //do something 
}); 

只要运行在任何代码加载ID的发言，或者钻机它在阿贾克斯处理程序，如果这就是它是如何得到加载这样的：

$.ajaxSetup({ 
    complete: function() { 
    $("#elementID").each(function() { 
    //do something 
    }); 
    }  
}); 

Answer 3

你可以使用live()方法：

$('div_id_or_class').live('click', function(){ 
// ................ 
});