沿着这条线的某个地方,我发现使用iframe是'糟糕的做法'.
这是真的?使用它们的优点/缺点是什么?
我Knockout.js
用来绑定iframe src
标签(这可以根据用户进行配置).
现在,如果用户已配置http://www.google.com(我知道它不会在iframe中加载,这就是为什么我将其用于-ve场景)并且必须在IFrame中显示.但它会引发错误: -
拒绝在框架中显示" http://www.google.co.in/ ",因为它将"X-Frame-Options"设置为"SAMEORIGIN".
我为iframe提供了以下代码: -
<iframe class="iframe" id="iframe" data-bind="attr: {src: externalAppUrl, height: iframeheight}">
<p>Hi, This website does not supports IFrame</p>
</iframe>
Run Code Online (Sandbox Code Playgroud)
我想要的是,如果网址无法加载.我想显示自定义消息.
骗子在这里
现在,如果我使用onload和onerror作为: -
<iframe id="browse" style="width:100%;height:100%" onload="alert('Done')" onerror="alert('Failed')"></iframe>
Run Code Online (Sandbox Code Playgroud)
它可以正常加载w3schools.com,但不能与google.com.
其次: - 如果我把它作为一个功能,并尝试像我在我的小提琴,它不起作用.
<iframe id="browse" style="width:100%;height:100%" onload="load" onerror="error"></iframe>
Run Code Online (Sandbox Code Playgroud)
我不知道如何让它运行并捕获错误.
编辑: - 我已经看到如果iframe没有在stackoverflow中加载或加载问题,想要调用函数,但它显示可以在iframe中加载的网站的错误.
另外,我已经在加载事件上看了Stackoverflow iframe 谢谢!!
我正在学习Web开发,并试图实现将外部网页添加到简单HTML页面的任务。因此,我有一个文本框,需要在其中放置URL,并根据该文本框来呈现iframe。src
使用的.attr
属性直接加载属性时,网页可以正确呈现jquery
。
没有文本字段的工作示例:
的HTML
<div id="mydiv">
<iframe id="frame" src="" width="100%" height="300">
</iframe>
</div>
<button id="button">Load</button>
Run Code Online (Sandbox Code Playgroud)
脚本
$(document).ready(function(){
$("#button").click(function () {
$("#frame").attr("src", "https://www.wikipedia.org/");
});
});
Run Code Online (Sandbox Code Playgroud)
以下是我想要的
的HTML
Enter the URL
<input id="url" type="text"/>
<div id="mydiv">
<iframe id="frame" src="" width="100%" height="300">
</iframe>
</div>
<button id="button">Load</button>
Run Code Online (Sandbox Code Playgroud)
脚本
<script>
$(document).ready(function(){
$("#button").click(function () {
var x = $("#url").val();
$("#frame").attr('src', 'x');
});
});
</script>
Run Code Online (Sandbox Code Playgroud)
我提到了此链接,但找不到答案。我的JSfiddle新手尝试将错误消息显示为{"error": "Please use POST request"}
。我需要使用load
jquery方法吗?我只想阅读文本框的内容,然后单击按钮在iframe中打开页面。链接到我的JSFiddle