Question

我想用以下内容创建一个弹出窗口：

用户单击显示div 1内容的div 1时，打开弹出窗口。
如果弹出框中已经存在div 1的内容，并且用户单击div 1，则不执行任何操作
用户单击div 2时，清除弹出窗口并显示div 2的内容。

我尝试了以下操作，但条件语句始终为true，因为新弹出窗口始终包含单击的div的内容。

能否请您提出建议

首选纯JavaScript

HTML：

<div class="s1" onclick="basicPopup('',this);">Div 1</div>
<div class="s1" onclick="basicPopup('',this);">Div 2</div>

JS：

function basicPopup(url,t1) {
  popupWindow = window.open(url,'popUpWindow','height=500,width=500,left=100,top=100, resizable=yes,scrollbars=yes,toolbar=yes,menubar=no,location=no,directories=no, status=yes'); 
  popupWindow.document.body.innerHTML = t1.innerHTML;
  return false; //make sure parent window doesn't refresh

  if(popupWindow.document.body.innerHTML==t1.innerHTML){
    return false; //if equal do nothing
  }

  else {
    popupWindow.document.body.innerHTML='';
    popupWindow.document.write(t1.innerHTML);
  }

}

Answer 1

在return false语句之前删除if。返回会立即退出该函数，并且此函数之后的任何代码都将无法运行。

JSFiddle：http://jsfiddle.net/mu6751xk/

function basicPopup(url,t1) {
  popupWindow = window.open(url,'popUpWindow','height=500,width=500,left=100,top=100, resizable=yes,scrollbars=yes,toolbar=yes,menubar=no,location=no,directories=no, status=yes'); 
  popupWindow.document.body.innerHTML = t1.innerHTML;
}

谢谢。但是，当弹出窗口中存在div 1内容时，当我说“什么也不做”时，我的意思是div 1不可单击，因此对div 1的多次单击将失败。（即弹出窗口不应刷新，父窗口将覆盖弹出窗口）

在尝试打开弹出窗口之前，应先进行检查。

JSFiddle：http://jsfiddle.net/xrsw4Lou/

Answer 2

除了返回false之外，您还首先将div的值分配给window，然后再进行检查，这当然总是返回true。

function basicPopup(url,t1) {
  popupWindow = window.open(url,'popUpWindow','height=500,width=500,left=100,top=100, resizable=yes,scrollbars=yes,toolbar=yes,menubar=no,location=no,directories=no, status=yes'); 

  if(popupWindow.document.body.innerHTML==t1.innerHTML){
    return false; //if equal do nothing
  }
  else {
    popupWindow.document.body.innerHTML='';
    popupWindow.document.write(t1.innerHTML);
  }
}

我都删除了

popupWindow.document.body.innerHTML = t1.innerHTML;
return false; //make sure parent window doesn't refresh

更新：其实我们在这里思考。只是分配新值似乎也会做同样的事情，只是每次都会填充内容：

function basicPopup(url,t1) {
  popupWindow = window.open(url,'popUpWindow','height=500,width=500,left=100,top=100, resizable=yes,scrollbars=yes,toolbar=yes,menubar=no,location=no,directories=no, status=yes'); 
  popupWindow.document.body.innerHTML = t1.innerHTML;    
}

带有相同div内容检查的Window.open

2 个答案: