我的客户在其网站上有一个链接,在弹出窗口中打开一个客户服务聊天窗口。他们看到用户多次点击聊天链接,这会打开多个聊天会话,并且会丢失他们的统计信息。我需要在打开聊天窗口时禁用链接,并在聊天窗口关闭时恢复它。我无法修改/访问子窗口。
原始链接如下所示:
<a class="initChat" onclick="window.open('https://chatlinkhere.com','chatwindow','width=612,height=380,scrollbars=0'); return false;">
我认为最好的办法是将window.open()
作为变量存储在函数中:
function openChat() {
child = window.open('http://www.google.com', 'chatwindow', 'width=612,height=380,scrollbars=0,menubar=0');
}
并将链接HTML更改为
<a class="initChat" onclick="openChat();">
注意:理想情况下,我想检测原始onclick的值,并将其存储在变量中。类似的东西:
jQuery('.initChat').find().attr('onclick');
但我不知道如何存储它然后再调用它。
接下来我需要检查聊天窗口是否打开:
timer = setInterval(checkChild, 500);
function checkChild() {
if (child.open) {
alert("opened");
jQuery(".initChat").removeAttr("onclick");
jQuery(".initChat").css("opacity", ".5");
clearInterval(timer);
}
if (child.closed) {
alert("closed");
jQuery(".initChat").attr('onclick', 'openChat(); checkChild();');
jQuery(".initChat").css("opacity", "1.0");
clearInterval(timer);
}
}
注意:警报只是用于测试。
将新功能添加到链接
<a class="initChat" onclick="openChat(); checkChild();">
一旦聊天窗口关闭,我需要将onclick属性恢复到链接(有更简单的方法吗?)
小提琴演示在这里 - &gt; http://jsfiddle.net/JkthJ/
当我检查Chrome控制台时,我收到了错误消息
Uncaught TypeError: Cannot read property 'open' of undefined
更新 在http://jsfiddle.net/JkthJ/2/给我留下答案的人,非常感谢你的作品! :)
答案 0 :(得分:0)
我认为你需要的是打开弹出窗口,如果已经打开然后专注于弹出窗口或什么都不会发生
你可以将你的功能重写为
var winPop = false;
function OpenWindow(url){
if(winPop && !winPop.closed){ //checks to see if window is open
winPop.focus(); // or nothing
}
else{
winPop = window.open(url,"winPop");
}
}
答案 1 :(得分:0)
只是以简单的方式做到这一点。在子窗口打开后禁用锚链接上的鼠标事件。
<强> CSS 强>
.disableEvents{
pointer-events: none;
}
<强> JS 强>
var childWindow;
$('a').on('click',function(){
childWindow = window.open('_blank',"height:200","width:500");
$(this).addClass('disableEvents');
});
if (typeof childWindow.attachEvent != "undefined") {
childWindow.attachEvent("onunload", enableEvents);
} else if (typeof childWindow.addEventListener != "undefined") {
childWindow.addEventListener("unload", enableEvents, false);
}
enableEvents = function(){
$('a').removeClass('disableEvents');
};
<强>更新强>
您的子窗口是纯HTML页面。在子窗口html代码中进行更改:
<html>
<head>
<script>
function myFunction()
{
window.opener.enableEvents(); //it calls enableEvents function
}
</script>
</head>
<body onunload="myFunction()">
<!--your content-->
</body>
</html>
答案 2 :(得分:0)
这就是我最终的工作:
<a class="initChat" onclick="checkWin()"></a>
<script>
var myWindow;
function openWin() {
myWindow = window.open('https://www.google.com', 'chatwindow', 'width=612,height=380,scrollbars=0');
}
function checkWin() {
if (!myWindow) {
openWin();
} else {
if (myWindow.closed) {
openWin();
} else {
alert('Chat is already opened.');
myWindow.focus();
}
}
}
</script>