簡體   English   中英

window.open()在JS函數中無法正常工作

[英]window.open() doesn't work correctly inside a JS function

我試圖為我的網站創建一個更新列表,以便當我單擊相關更新時,將打開一個新的附加小html窗口,我將看到完整的更新內容。
這是我寫的代碼:

index.html:

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8" />
    <script type="text/javascript" src="script.js"></script>
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js"></script>
</head>

<body ng-app="myApp">

<p ng-controller="updatesCtrl">
    <span ng-repeat="x in updates">
        <a href="updateWindow.html" onclick="showUpdate(x.title,x.update)">&#9679; {{x.title}}</a>
        <br><br>
    </span>                 
</p>

<script>updates();</script>

</body>
</html> 

script.js:

function updates(){
    angular.module('myApp', []).controller('updatesCtrl', function($scope) {
    $scope.updates = [
        {title:"update1",update:"update1 content"},
        {title:"update2",update:"update2 content"}
        ];
    });
}

function showUpdate(title, update){ 
    var win=window.open('updateWindow.html','newwindow','width=600, height=350'); 
    win.document.getElementById("title").innerHTML=title;
    win.document.getElementById("update").innerHTML=update;
    return false;
}

updateWindow.html:

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8" />
</head>
<body>

<h1 id="title"></h1>
<p id="update"></p>

</body>
</html>  

我在這里有幾個問題:
1.當我單擊更新鏈接時,更新窗口替換了主頁(index.html)窗口,並且也是一個完整頁面。
2.盡管我編寫了一個腳本,假設未在這些位置輸入html內容,但updateWindow的<h1><p>並未進行任何更改。

我不明白為什么我沒有得到這段代碼期望的結果。 特別是,我不明白第一個問題:如果我只嘗試用以下內容替換index.htmlonclick內容: "window.open('updateWindow.html','newwindow','width=600, height=350'); return false;" -我得到了一個新的附加窗口,其尺寸比預期的要小(我不會在此窗口中獲取更新內容,但至少可以解決我的第一個問題)。

我的代碼有什么問題?

嘗試使用window.open('updateWindow.html','_blank','width=600, height=350'); 代替

在您嘗試更新html之前,我認為該窗口未加載: 我的娛樂屏幕截圖 你可以看到html頁面甚至還沒有加載尚未和開發者工具說,有一個Uncaught TypeError: Cannot set property 'innerHTML' of null嘗試獲得新的頁面來更新它onload在更新頁面。

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM