jQuery'关于函数dos'我似乎不喜欢'加载'事件
jQuery's .on function doesn't seem to like 'load' event
我有一个完全由ajax驱动的网站,所以最近我不得不研究委派技术。我了解到.live和.delete已经被弃用,要使用的新函数是.on.
如果我正在动态地将网页加载到当前页面上的分区(AJAX)中,如下所示:
<html>
<head>
<script src="jquery.js">
</script>
<script>
function ajaxTest()
{
$('#content').load('test.php');
}
</script>
<script type="text/javascript">
$(function(){
$(document).on("click", "#map", function(){
alert("it has been loaded");
});
});
</script>
</head>
<body>
<div id="content">
<button onClick="ajaxTest()" value="Click Me">
This is to be clicked
</button>
</div>
</body>
</html>
test.php看起来像
<html>
<head>
</head>
<body>
<div id="map">THIS IS THE MAP</div>
</body>
</html>
然后我可以点击"这就是地图",它确实显示了警报。我一直面临的问题是:
$(document).on("**click**", "#map", function(){
我需要更多的东西:
$(document).on("**load**", "#map", function(){
它显然不起作用,所以我想知道类似的东西是否可能。我之所以询问这一点,是因为在某些页面中,我有一个谷歌地图或swf对象或其他什么,而不是在地图部分只显示"这就是地图"。如有任何帮助,我们将不胜感激。
如果你只想回答如何将谷歌地图加载到一个还不存在的部门,那也会很有帮助;)
只有一些事件在父链上冒泡,并且可以在具有.on()
、.live()
或.delegate()
的父对象上使用。.load()
不是那些冒泡的事件之一。
这是jQuery文档中弹出的事件的部分列表:click、dblclick、keydown、keypress、keyup、mousedown、mousemove、mouseout、mouseover和mouseup。
从.on()
的文档页面,这里有一个报价:
在所有浏览器中,加载事件都不会冒泡。
在您的特定示例中,您可以将事件直接绑定到如下对象:
$("#map").on("load", function(){});
或
$("#map").load(function(){});
当您像这样直接绑定到对象时,不需要冒泡,它将与加载事件一起工作。在绑定事件处理程序时,对象#map
需要存在,因为这种使用.on()
或.load()
的方法无法处理将来创建的对象。创建对象后,必须将事件处理程序附加到对象。
如果你想在response
是loaded
时做一些事情,你可以在加载中使用callback
function
,而不是在两个单独的脚本和事件绑定中做,比如
$('#content').load('test.php', function(){
alert("map is loaoded.")
});
参考
- 分派点击事件并保留击键修饰符
- 模糊事件的Javascript测试
- keyup事件处理程序更改焦点不适用于快速键入
- 使用 jQuery 的 .on 函数如何获取事件的原始元素
- 如何使Javascript动态html表及其上的事件
- 使用类从一个标记中双击事件
- 如何在未直接触发的情况下停止事件
- 如何在elfinder插件(一个文件管理器插件)上获得上传前事件
- 对iPad上的点击事件反应缓慢
- 事件和状态
- Fancybox是否将Click事件静音
- 主干-不管怎样,检查事件以前是否绑定过
- 从控制器返回后Ajax启动事件激发
- 如何从画布上的某个移动事件中获取X和Y
- Jquery:未触发select事件
- JsFiddle上的鼠标事件不起作用
- 只覆盖箭头键滚动事件
- $window.ga在AngularJS事件中未定义
- cron作业与Javascript计时事件
- jQuery'关于函数dos'我似乎不喜欢'加载'事件