我制作了一个jQuery / javascript,在点击图片时将页面加载到div中。它适用于IE,Firefox,Chrome但 NOT Opera .. 我无法弄清楚它为什么不起作用..
请查看此页面并单击产品以查看它如何加载弹出窗口。 http://www.dev.dressmind.com
以下是点击的脚本:
function qp(id) {
$.ajax({
method: "get",
url: "QuickProduct.aspx",
data: "id=" + id,
//beforeSend: function() { $('#main').hide('slow').fadeOut(); },
complete: function() {
$('#product-area').show('200').fadeIn();
$("#product-area-overlay").show();
$(".productbox-hover").hide();
},
success: function(result) {
$('#product-area').html(result);
}
});
}
然后我有一个看起来像这样的链接:
<a href="#" id="123123" onClick="qp(123123);return false;"><div></div</a>
所以请,有人可以快速查看并帮助我解决这个问题。
解决了
我通过将onclick-event移动到div中的div而不是在链接上来解决它。
< a href="#" id="123123">
< div **onClick="qp(123123);return false;"**> < /div>
< /a>
答案 0 :(得分:1)
除了id's可能不是以@Kanishka所提到的数字开头这一事实,你没有按照你使用的方式发布代码。
您正在调用您的函数:onclick="qp(id)"
。与其他浏览器不同,Opera(正确地)将id
视为未定义的变量。其他浏览器可能猜测你实际上是指当前元素的id
属性。您需要改为使用onclick="qp(this.id)"
。
要删除无效ID并重复onclick处理程序,您应该考虑一次性分配事件处理程序。像这样:
<a href="#" data-product-id="123456">...</a>
<a href="#" data-product-id="222222">...</a>
<!-- etc. -->
<script>
jQuery("[data-product-id]").click(function() {
qp(jQuery(this).data('product-id')); return false;
});
</script>
BTW:非Javascript用户怎么样?
还有一件事:您似乎使用HTML5功能,但XHTML Doctype会导致许多验证错误。
答案 1 :(得分:0)
尝试通过jQuery本身分配事件处理程序,而不是使用过时的onclick
属性:
<a href="#" id="123123" class="example">[image]</a>
$(".example").click(function(e) {
qp(this.id);
}
function qp(id) {
// ... your function...
}