-1

我的網頁加載的背景，然後我點擊鏈接，它給了我像我預期的JavaScript，但一旦它完成並輸出結果，它會與我的結果進入一個空白的白色屏幕。我希望結果以背景顯示在我的網頁上。我嘗試過並且無濟於事。這裏是我的代碼：Javascript一直隱藏我的網頁背景

<!doctype html> 
<html> 
<head> 
<meta charset="utf-8"> 
<title>Untitled Document</title> 
<script type="text/javascript"> 
function myFunction() 
{ 

var accountnum; 
var beginningBal; 
var itemsCharged; 
var credits; 
var creditLimit; 
var sum; 

accountnum = window.prompt("Enter the account number:"); 

beginningBal = window.prompt("Enter the beginning balance:"); 

itemsCharged = window.prompt("Total of all items charged:"); 

credits = window.prompt("Total credits applied to this account:"); 

creditLimit = window.prompt("Enter the credit limit: "); 

var zero = parseInt (accountnum); 
var first = parseInt(beginningBal); 
var second = parseInt(itemsCharged); 
var third = parseInt (credits); 
var fourth = parseInt (creditLimit); 
var sum = first + second - third; 
var diff = fourth - sum; 
if (sum < fourth) 
{ 
    document.writeln("<h1>Your account number is:" + zero); 
    document.writeln("<h1>Your beginning balance is: $" + first); 
    document.writeln("<h1>Total of items charged: $" + second); 
    document.writeln("<h1>Total credits applies to this account: $" + third); 
    document.writeln("<h1>Your credit limit is: $" + fourth); 
    document.writeln("<h1>Your account balance is: $" + sum); 
    document.writeln("<h1>Your credit is: $" + diff); 
    document.getElementById('output').innerHTML = html; 

} 
else if (sum > fourth) 
{ 
    document.writeln("<h1>Your account number is:" + zero); 
    document.writeln("<h1>Your beginning balance is: $" + first); 
    document.writeln("<h1>Total of items charged: $" + second); 
    document.writeln("<h1>Total credits applies to this account: $" + third); 
    document.writeln("<h1>Your new account balance is: $" + sum); 
    document.writeln("<h1>Your credit limit is: $" + fourth); 
    document.writeln("<h1>Your new balance is: $" + diff); 
    document.writeln("<h1>Your credit is exceeded!"); 
    document.getElementById('output').innerHTML = html; 
} 
else if (sum == fourth) 
{ 
    document.writeln("<h1>Your account number is:" + zero); 
    document.writeln("<h1>Your beginning balance is: $" + first); 
    document.writeln("<h1>Total of items charged: $" + second); 
    document.writeln("<h1>Total credits applies to this account: $" + third); 
    document.writeln("<h1>Your account balance is: $" + sum); 
    document.writeln("<h1>Your credit limit is: $" + fourth); 
    document.writeln("<h1>Your new balance is: $" + diff); 
    document.writeln("<h1>You are out of credit!"); 
    document.getElementById('output').innerHTML = html; 
} 
} 

</script> 
<style> 
#output{ 
    height:43px; 

} 
html{ 
    background: url(images/nxerainbowgrid.jpg) no-repeat center center fixed; 
    z-index:-9999; 
    -webkit-background-size: cover; 
    -moz-background-size: cover; 
    -o-background-size: cover; 
    background-size: cover; 
    filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='images/nxerainbowgrid.jpg', sizingMethod='scale'); 
-ms-filter: "progid:DXImageTransform.Microsoft.AlphaImageLoader(src='images/nxerainbowgrid.jpg', sizingMethod='scale')"; 
} 
</style> 
</head> 

<body> 
<a href="#" onClick="myFunction()"><p>CLICK HERE TO HAVE FUN!!!</p></a> 
<div id="output"></div> 
</body> 
</html>

來源

2013-09-23 Dewayne Phillips

JSfiddle將對我們有用 – Rich

雖然這不是最好的方法。或正確的方式。你不應該重複很多代碼。並使用提示符。以下可能是一個臨時解決方案

定義html並將ccs樣式更改爲正文。在這種情況下。背景圖片將適合頁面的主體

var html; 
if(sum<forth){ 
    html ="<h1> Your account number is:" + zero + "</h1>"; 
    html ="<h1>Your beginning balance is: $" + first + "</h1>"; 
    html ="<h1>Total of items charged: $" + second + "</h1>"; 
    html ="<h1>Total credits applies to this account: $" + third + "</h1>"; 
    html ="<h1>Your credit limit is: $" + fourth + "</h1>"; 
    html ="<h1>Your account balance is: $" + sum + "</h1>"; 
    html ="<h1>Your credit is: $" + diff + "</h1>"; 
    document.getElementById('output').innerHTML = html; 
}  


body{ 
    background: url(index.jpeg) no-repeat center center fixed; 
    /*keep all other. only change the tag name*/ 
}

來源

2013-09-23 03:05:12 KhanSharp

我會嘗試。給我一點時間。 –

好吧，也許我不理解你把：document.getElementById（'output'）。innerHTML =「

我的Dom

」;我不明白你的意思

我的Dom

–

你有沒有輸入設置。爲每個步驟。我正在輸入號碼並看到結果。在你的情況下，你看到的背景圖像。 – KhanSharp

Javascript一直隱藏我的網頁背景

回答

我的Dom

我的Dom

相關問題