如何在新窗口中輸入JavaScript（window.open（））？

對於JavaScript分配，我將使用window.open（）創建一個新窗口。此窗口將使用document.write（）填充內容。該窗口必須具有使用JavaScript來改變窗口中文本大小的按鈕。如何在新窗口中輸入JavaScript（window.open（））？

我的問題是，如何在這個新窗口中使用或寫入JavaScript，以便調整窗口的文本大小？

這裏是我的代碼縮短版（存儲在外部js文件）：

var newWindow; 
 

 
function displayWindow() { 
 
    newWindow = window.open("", "newWindow", "width=800, height=600"); 
 
    newWindow.document.write('<button onclick="resizeText(1)">-</button> Text size <button onclick="resizeText(2)">+</button>'); 
 
    newWindow.document.write('Here is some text that I would like to be able to be resized.'); 
 
} 
 

 
function resizeText(change) { 
 
    switch (change) { 
 
     case 1: 
 
     newWindow.document.style.fontsize = "80%"; 
 
     break; 
 
     case 2: 
 
     newWindow.document.style.fontsize = "120%"; 
 
     break; 
 
     default: 
 
     alert('Error'); 
 
     break; 
 
    } 
 
}

如何訪問文件撰寫之內我的JavaScript函數（）？我也嘗試在document.write（）語句中編寫函數，但這也不起作用。

謝謝，馬克。

來源

2015-05-15 Mark

你不關閉你的'之開關語句，你忘了'}' – Downgoat

看來，你試圖調用一個函數在父窗口，這是不會工作。嘗試改變你的按鈕onclick「opener.resizeText（1）」。請參閱：[MDN：window opener]（https://developer.mozilla.org/en-US/docs/Web/API/Window/opener） – Roberto

@ vihan1086感謝您指出這一點，我已將其編輯。不幸的是，是不是問題 – Mark

馬克 -

下面的例子工作，提供的彈出窗口不被阻止。這只是你能做到這一點的許多方法之一。請注意，它使用「opener」在父窗口中調用函數，然後更改正文的字體大小。你的代碼試圖設置文檔的字體大小，這不是你想要的，即它不會做任何事情。另請注意，fontSize區分大小寫，如果使用「fontsize」，則不會發生任何情況。最後，在設置正文字體大小時不要使用百分比，因爲它不會像您預期的那樣工作。而是使用px（像素）。無論如何，這應該足以讓你走了，我會把細節留給你。

<html> 
<body onload="init()"> 
<h2>Parent Window</h2> 
<script type="text/javascript"> 

    var popup; 

    function init() { 
     popup = window.open("", "newWindow", "width=800, height=600"); 
     if (popup) popup.document.write('<html><body>Child Window<br><button onclick="opener.fontSize(48)">Test</button></body></html>'); 
    } 

    function fontSize(size) { 
     popup.document.body.style.fontSize = size + 'px'; 
    } 

</script> 
</body> 
</html>

來源

2015-05-15 23:52:53 Roberto

非常感謝您花時間做到這一點。我現在已經開始工作了。我還注意到我沒有在DOM中添加「body」，並且沒有在「fontSize」中大寫「S」。 – Mark

根據你所擁有的已經此代碼：

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
<head> 
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 
<title>Untitled Document</title> 

<script language="JavaScript" type="text/javascript"> 
var newWindow; 

function displayWindow() { 
    newWindow = window.open("", "newWindow", "width=800, height=600"); 

var windowInsertVar = ''; 
    windowInsertVar += '\x3Cscript>'; 
    windowInsertVar += 'function resizeText(change) {'; 
    windowInsertVar += 'switch (change) {'; 
    windowInsertVar += 'case 1:'; 
    windowInsertVar += 'document.getElementById(\'textToBeResized\').style.fontSize = "80%"\;'; 
    windowInsertVar += 'break\;'; 
    windowInsertVar += 'case 2:'; 
    windowInsertVar += 'document.getElementById(\'textToBeResized\').style.fontSize = "120%"\;'; 
    windowInsertVar += 'break\;'; 
    windowInsertVar += 'default:'; 
    windowInsertVar += 'alert(\'Error\')\;'; 
    windowInsertVar += 'break\;'; 
    windowInsertVar += '}'; 
    windowInsertVar += '}'; 
    windowInsertVar += '\x3C/script>'; 
    windowInsertVar += '<button onclick="resizeText(1)">-</button> Text size <button onclick="resizeText(2)">+</button>)\;'; 
    windowInsertVar += '<div id="textToBeResized">Here is some text that I would like to be able to be resized.</div>'; 

    newWindow.document.write(windowInsertVar); 
} 
</script> 

</head> 

<body> 
<button id="displayWindow" onClick="displayWindow();">Display Window</button> 
</body> 
</html>

來源

2015-05-16 00:12:11

這也是一個很好的答案，因爲它顯示了一個替代解決方案，即將功能移動到子窗口。 – Roberto

如何在新窗口中輸入JavaScript（window.open（））？

回答

相關問題