2017-05-04 12 views
0

フレームから選択して新しいウィンドウの背景色を変更したかったのですが、ラジオボタンのいずれかを選択すると、新しいウィンドウが1つ開き、ウィンドウの背景色が選択されたボタンの色になります。誰も私を助けることができますこれを解決する方法..私はどこが間違っているのか分からない。フレームの背景色を新しいウィンドウに変更する

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> 
<html> 
<head> 
<meta http-equiv="Content-Type" content="text/html; charset=windows-1252"> 
</head> 
<title> Frames and Window </title> 
<script> 

function openWindowWithColor() { 
    var color = this.getAttribute("data-color"); 
    console.debug("Open new window with color: " + color); 
    var myNewWindow = window.open(); 
    myNewWindow.document.body.style.background = color; 
} 
var radios = document.getElementsByTagName("input"); 

for(var i = 0; i < radios.length; i++) { 
    radios[i].addEventListener("change", openWindowWithColor); 
} 
</script> 

    <body> 

    <p style="color:red ; font-size:15pt"> Choose the background color for new window: 
     </p>    
     </br></br> 
    <label for="red">Red</label> 
<input type="radio" id="red" name="windowcolor" data-color="red" /> 
<label for="green">Green</label> 
<input type="radio" id="green" name="windowcolor" data-color="green" /> 
<label for="blue">Blue</label> 
<input type="radio" id="blue" name="windowcolor" data-color="blue" /> 

     <br></br> 
     <input type="button" id = "submit" name="" style="color: green; font-size:20pt" value="submit" size ="10" onclick="openWindowWithColor()"/> 
    </body> 
</html> 
+0

myNewWindow.document.body.style.background = colorを置き換えます。 myNewWindow.document.body.style.backgroundColor = color; – hamzox

答えて

0

は、このラインに myNewWindow.document.body.style.backgroundColor = color;

を変更してみてください、それがお役に立てば幸い!

+0

あなたの助けをありがとう.. !!!しかしまだそれは働いていない.. :( –

0

変更し、これに、JavaScriptとそれが動作するはずです:

function openWindowWithColor() { 
var color = this.getAttribute("data-color"); 
console.debug("Open new window with color: " + color); 
var myWindow = window.open("", "", "width=200,height=100"); 
myWindow.document.body.style.backgroundColor = color; 
} 

var radios = document.getElementsByTagName("input"); 

for(var i = 0; i < radios.length; i++) { 
radios[i].addEventListener("change", openWindowWithColor); 
} 

これは、選択した色で200x100pxウィンドウを開きます。

+0

あなたの助けに感謝します.. !!!しかし、まだ動作していません.. :( –

関連する問題