Question

我在同一个html中制作了一个文本框和一个iframe。我想将从文本框渲染的'html'加载到html中。我正在使用javascript按钮单击事件，但没有任何东西被渲染。请帮助，我无法找到我犯错误的地方！

HTML：

<button onClick="convert()">Run</button> 

<textarea id="mycode">
    Hello World!
</textarea>

<iframe id="display"></iframe>

Javascript：

function convert()
{
   var x = document.getElementById('mycode').value;
   document.getElementById('display').innerHTML = x;
}

有人可以帮忙，有什么不对吗？

Answer 1

尝试将src的{{1}} iframe设置为textarea值x

＆＃13;

function convert()
{
   var x = document.getElementById('mycode').value;
   document.getElementById('display').src = "data:text/plain," + x;
}

＆＃13;

<button onClick="convert()">Run</button> 

<textarea id="mycode">
    Hello World!
</textarea>

<iframe id="display"></iframe>

＆＃13;

Answer 2

只需替换

document.getElementById('display').innerHTML = x;

与

document.getElementById('display').contentWindow.document.body.innerHTML = x

Answer 3

您无法使用Javascript（或jQuery）操纵iframe，因为iframe本质上是一个单独的网页。这是出于安全目的，以防止一个网站将恶意脚本嵌入到可以定位主页的iframe中。据我所知，没有办法绕过它。一般来说，使用iframe不是好习惯。

Answer 4

我正在浏览同一任务的答案。好吧，接受的答案确实有点帮助，但主要任务是呈现“HTML”。它使用 iframe 标记的 srcdoc 属性工作。

filenames = glob.glob(DATA_DIR + '/*.txt')
with open('final.txt', 'w') as outputfile:
    for fname in filenames:
        with open(fname) as infile:
            for line in infile:
                outputfile.write(line)
            outputfile.write('\n')

    //
//  DemeView.swift
//  TalkPeak
//
//  Created by Sercan KAYA on 30.12.2020.
//

import SwiftUI

struct DemeView: View {
    @State var listes = [DeneModel(title: "a"),DeneModel(title: "b"),DeneModel(title: "c"),DeneModel(title: "d"),DeneModel(title: "e"),DeneModel(title: "f"),DeneModel(title: "g"),DeneModel(title: "h")]
    var body: some View {
        ScrollView{
            ForEach(0..<self.listes.count, id:\.self){i in
                VStack {
                    ViewModel(deneModel: self.listes[i])
                    if self.listes.count != i + 1 {
                        Divider()
                    }
                }
            }
        }
    }
}

struct DemeView_Previews: PreviewProvider {
    static var previews: some View {
        DemeView()
    }
}


struct ViewModel : View {
    var deneModel : DeneModel
    var body: some View {
        VStack{
            Text(self.deneModel.title)
            
        }
    }
}
struct DeneModel {
    var id = UUID()
    var title : String
}

在文本框中加载包含内容的iframe

4 个答案: