使用javascript更改html內容缺少內容

此刻我創建了一個頁面。該頁面將在Safari瀏覽器中與iPod Touch（第5代）一起顯示。另外，該頁面應該以全屏模式顯示。使用javascript更改html內容缺少內容

現在我開始解決這個問題，但有些內容丟失了。這是我的首頁index.html。

<!DOCTYPE html> 
 
<html> 
 

 
<head> 
 
    <link rel="stylesheet" type="text/css" href="css/desktop.css"> 
 
    <link rel="stylesheet" type="text/css" href="css/ipod.css"> 
 

 
    <script src="js/jquery-1.11.3.min.js"></script> 
 

 
    <meta name="apple-touch-fullscreen" content="yes" /> 
 
    <meta name="apple-mobile-web-app-capable" content="yes" /> 
 
    <meta name="apple-mobile-web-app-status-bar-style" content="black"> 
 

 
    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" /> 
 
</head> 
 

 
<body> 
 
    <div id="content"> 
 
    <div id="dumpingStationButtonContainer"> 
 
     <a id="dumpingStationOneButton" class="dumpingStationButton">Lader&uuml;ssel 1</a> 
 
     <a id="dumpingStationTwoButton" class="dumpingStationButton">Lader&uuml;ssel 2</a> 
 
    </div> 
 
    </div> 
 

 
    <script type="text/javascript"> 
 
    $(document).ready(function() { 
 
     $('#dumpingStationOneButton').click(function() { 
 
     $('body').load("dumpingStationOne.html"); 
 
     }); 
 

 
     $('#dumpingStationTwoButton').click(function() { 
 
     $('body').load("dumpingStationTwo.html"); 
 
     }); 
 
    }); 
 
    </script> 
 
</body> 
 

 
</html>

dumpingStationOne.html

<div id="content"> 
 
    <div id="cameraContainer"> 
 
    <script type="text/javascript"> 
 
     var sDomainPort = 80; 
 
     var Speck_var = 0; 
 
     var channel_s = 0; 
 
     var view_w = 900; 
 
     var view_h = 675; 
 

 

 
     if (window.innerWidth > 0) { 
 
     window_width = window.innerWidth; 
 
     } else { 
 
     window_width = screen.width; 
 
     } 
 

 
     if (window_width < 981) { 
 
     var percent = window_width/view_w; 
 
     view_w = window_width; 
 
     view_h = percent * view_h; 
 
     } 
 

 
     function onLive(sDomainURL, test) { 
 
     var ret; 
 
     var obj = document.getElementById(test); 
 
     obj.Author('admin', 'admin'); 
 
     obj.SetDateFormat(0); 
 
     obj.SingleAudio = 0; 
 
     obj.VideoPath = channel_s; 
 
     obj.UnderScan = 1; 
 
     obj.ROILEFT = 0; 
 
     obj.ROITOP = 0; 
 
     obj.ROIRIGHT = 0; 
 
     obj.ROIBOTTOM = 0; 
 

 
     //var bSuccess = obj.CheckInitState; 
 
     //if (bSuccess == 0) { 
 
     // \t setTimeout("onLive();", 1000); 
 
     // \t return; 
 
     //} 
 
     obj.LivePlay(sDomainURL, sDomainPort, sDomainPort, 0); 
 
     } 
 

 
     function closeActiveX(test) { 
 
     var obj = document.getElementById(test); 
 
     obj.CloseActiveX(); 
 
     } 
 

 
     document.write('<object id="LiveShow1" classid="clsid:f9bf64a0-5a65-43e0-acdb-b223e7f9ddd9" CODEBASE="WEBWATCH2.cab#version=1,2,5,24" width="' + view_w + '" height="' + view_h + '"> '); 
 
     document.write('<img id="camera" width="' + view_w + '" height="' + view_h + '" src="http://192.168.1.195/GetData.cgi?CH=1" alt="Die Verbindung wurde unterbrochen. Bitte warten..."</img>'); 
 
     document.write('</object>'); 
 
    </script> 
 
    </div> 
 

 
    <div id="operationButtonContainer"> 
 
    <a id="btnMoveUp" unselectable="on" class="operationButton">Heben</a> 
 
    <a id="btnStartStop" unselectable="on" class="operationButton">Start</a> 
 
    <a id="btnMoveDown" unselectable="on" class="operationButton">Senken</br></a> 
 
    <div id="circleDiv"> 
 
     <div id="lifeCircle" class="greenCircle"></div> 
 
    </div> 
 
    <a id="btnBack" unselectable="on" class="operationButton" href="index.html">Zur&uuml;ck</a> 
 
    </div> 
 
    <div class="clearBoth"></div> 
 
</div>

的按鈕是丟失。代碼是錯誤的，我按下頁面右鍵單擊 - >顯示代碼，並在頁面上的代碼是：

<object id="LiveShow1" classid="clsid:f9bf64a0-5a65-43e0-acdb-b223e7f9ddd9" CODEBASE="WEBWATCH2.cab#version=1,2,5,24" width="900" height="675"> <img id="camera" width="900" height="675" src="http://192.168.1.195/GetData.cgi?CH=1" alt="Die Verbindung wurde unterbrochen. Bitte warten..."</img></object>

這就是所有。按鈕丟失。我錯了什麼？誰能幫我？

來源

2016-01-08 MyNewName

我認爲「document.write」取代了頁面上的所有內容。那是你要的嗎？嘗試使用以下內容將內容設置爲div：document.getElementById（'myDiv'）。innerHTML =「text」; – arpo

@arpo感謝您的評論。你的想法是正確的！寫一個答案，我會將它標記爲解決方案。 – MyNewName

「document.write」替換頁面上的所有內容。使用document.getElementById（'myDiv'）。innerHTML =「text」;代替。像這樣：

<div id="myDiv"></div> 

<script type="text/javascript"> 
    var code = '<object id="LiveShow1" classid="clsid:f9bf64a0-5a65-43e0-acdb-b223e7f9ddd9" CODEBASE="WEBWATCH2.cab#version=1,2,5,24" width="\' + view_w + \'" height="\' + view_h + \'">' + 
       ' <img id="camera" width="\' + view_w + \'" height="\' + view_h + \'" src="http://192.168.1.195/GetData.cgi?CH=1" alt="Die Verbindung wurde unterbrochen. Bitte warten..." </img>\'' + 
       '</object>'; 
    document.getElementById('myDiv').innerHTML = code; 
</script>

來源

2016-01-08 09:27:13 arpo

使用javascript更改html內容缺少內容

回答

相關問題