Wie öffne ich ein neues Fenster und füge HTML mit jQuery ein?

68

Ich versuche, ein neues Fenster aus Javascript zu öffnen, aber es wird nichts in das HTML eingefügt:

var callScriptText = $('#callScriptText').html();
var url = '/Action/CallScript/?callScript=';

// Open the current call script in a new window
var openWindow = window.open(url, 'callScriptPopup', 'width = 500, height = 500');
$(openWindow).html(callScriptText);

Weiß jemand warum?

javascript jquery html

— Feen Königin
quelle

118

Hier ist ein Beispiel zum Öffnen eines neuen Fensters mit Inhalten mithilfe von jQuery

<script>
function nWin() {
  var w = window.open();
  var html = $("#toNewWindow").html();

    $(w.document.body).html(html);
}

$(function() {
    $("a#print").click(nWin);
});
</script>

<div id="toNewWindow">
    <p>Your content here</p>
</div>

<a href="javascript:;" id="print">Open</a>

EDIT: Für diejenigen, die sagen, dass dieser Code nicht funktioniert, ist hier eine jsfiddle, um es zu versuchen http://jsfiddle.net/8dXvt/

— Juanma
quelle

Danke das hat funktioniert! Aber wie füge ich eine URL hinzu, damit nicht nur Folgendes steht: leer?

— FairyQueen

Wenn Sie die URL im neuen Fenster haben möchten, ersetzen Sie einfach das Fenster. Öffnen durch window.open('/Action/CallScript/?callScript=', 'myWin', 'width = 500, height = 500');Das lädt die URL und setzt diesen Namen in das Fenster. Sie können auch die Zeile löschenvar html=$("#toNewWindow").html();

— Juanma

Freut mich das hier. Setzen Sie meine Frage als OK und meine Arbeit ist hier erledigt :)

— Juanma

1

Gibt es eine Möglichkeit, das Loch HTML <html><head><title></title><script></script><body></body></html>

— einzufügen

1

Sie können auch den Druckdialog öffnen: `function nWin () {` var w = window.open (); `var html = $ (" # toNewWindow "). html (); `` $ (w.document.body) .html (html); `w.print (); `w.close (); `}

— CSQ

86

Versuche dies:

var x=window.open();
x.document.open();
x.document.write('content');
x.document.close();

Ich finde, es funktioniert in Chrome und IE.

— Emre
quelle

11

Dies funktioniert besser als die jQuery-Lösung, da Sie ein gesamtes HTML-Dokument einschließlich des Doctype und der <head>Tags schreiben können .

— quietmint

1

funktioniert nicht in meinem Chrome Version 51.0.2704.84 m. Das x nach window.open () gibt undefiniert zurück, so dass es kein Dokument hat

— LucVH

saubere und einfache Lösung

— Saurabh Solanki

Vielen Dank! @ LucVH Wenn Ihr Browser das Popup blockiert, können Sie es überprüfen und hinzufügen if(!x) alert('Enable popups please!): Quelle: Link

— Euler Ribeiro Sudbrack

— Schien

25

Aufbauend auf der Antwort von @ Emre.

Mit Javascript können Sie verketten, also habe ich den Code einfach geändert zu:

var x=window.open();
x.document.open().write('content');
x.close();

Geben Sie außerdem die ersten Zeilenabmessungen an, um ein neues Fenster (keine neue Registerkarte) zu erzwingen. Aber es muss das dritte Argument sein. Ändern Sie also die erste Zeile in:

var x=window.open('','','width=600, height=600');

— Sablefoste
quelle

Diese Verkettung ist etwas zu aggressiv. Document.write () gibt nichts zurück, daher meldet Chrome: Nicht erfasst TypeError: Die Eigenschaft 'close' von undefined kann nicht gelesen werden.

— JJJV

@jjrv, das ist keine aggressive Verkettung ... Sie sollten zuerst vor der Verkettung überprüfen ... zBif(content!=='undefined'){x.document.open().write(content).close();}

— Sablefoste

1

document.write () gibt immer undefined zurück, daher ruft der verkettete Code immer undefined.close () auf und gibt immer einen Fehler aus.

— JJRV

In den guten alten Zeiten konnten die Parameter window.open auch keine Leerzeichen haben: P

— Joe

3

Versuchen:

var x = window.open('', '', 'location=no,toolbar=0');
x.document.body.innerHTML = 'content';

— Hasan A Yousef
quelle

Funktioniert in Chrom 70

— DropHit

Die Frage wurde speziell nach einer Lösung mit jquery gestellt.

— SouvikMaji

1

var codeContents = $("#contentsfornewWindow").html()
var win = window.open('', 'title', 'toolbar=no,location=no,status=no,menubar=no,scrollbars=yes,resizable=yes,width=1000,height=1000,left=200,top=70');

win.document.body.innerHTML = codeContents;

VS:

win.document.write(codeContents);

Ich habe bemerkt, wenn es Iframes wie youtubes Videos gibt, win.document.writelädt die Iframes wo wie document.body.innerHTMLnicht!

— Tejpal Sharma
quelle

Hast du eine Idee warum? Wie kann man die Verwendung von document.write () vermeiden und trotzdem Ressourcen wie Bilder, Iframes usw. laden?

— D. Petrov