我正在尝试创建一个具有不同功能的干净的jquery弹出窗口。我不想使用插件(我想学习大声笑)。这就是我想要的。
现在这就是我所拥有的:http://jsfiddle.net/RYwsy/2/
我做了一些研究,但有很多不同的技术,我完全失去了。我希望用最简洁/最快的方式使用jQuery做到这一点。
我仍在搜索和尝试,但我也想要一些帮助。
谢谢!
哇,这比预期更棘手......长话短说,我编辑了你的小提琴:Here,它现在有效。
编辑:更加整洁地使用事件传播的新小提琴:http://jsfiddle.net/RYwsy/23/
第3点非常简单。如果您希望内容来自页面上的某个位置,请根据所单击链接的某些属性或其所在的上下文(例如查看其兄弟姐妹或其他内容)来查找内容。在我的示例中,我刚刚为链接添加了一个id属性,并使用它来标识包含内容的隐藏div并将其插入弹出窗口中。
第2点更棘手。起初我只是将一个点击处理程序附加到除弹出窗口之外的所有内容,并将弹出窗口隐藏在那里。这不起作用,因为弹出窗口中的点击事件通过dom向上传播,并最终到达隐藏弹出窗口的某个元素。然后,我添加了一个检查是否单击弹出窗口,如果是,请停止传播。
这是否是最干净的解决方案可能是非常有争议的,但它是相当干净的,如果没有其他什么是一个很好的例子,为什么你需要了解javascript中的事件传播:-)
你可以使用这样的东西在弹出窗口中加载HTML -
$('a').click(function(e) {
e.preventDefault();
var thisHREF = $(this).attr('href');
$('popup').load(thisHREF);
});