我想通过ajax在我的div中加载iframe。怎么办?
<button id="iframeload">Load Iframe</button>
<div id="iframe_content"></div>
<script type="text/javascript">
$('.iframeload').click(function(event) {
event.preventDefault();
event.stopImmediatePropagation();
$.ajax({
type: "POST",
url : "https://pecom.ru/ru/calc/?iframe=Y",
success : function (data) {
// alert('ok');
$("#iframe_content").html(data);
}
});
});
此iframe
按钮#iframeload不起作用...
答案 0 :(得分:1)
<!DOCTYPE html>
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<script>
$(document).ready(function(){
$('#iframe').attr('src', 'https://www.qries.com');
});
</script>
</head>
<body>
<iframe id="iframe" name="myIframe" frameborder="5" width="500" height="300"></iframe>
</body>
</html>
答案 1 :(得分:0)
第一个错误
您正在使用elements类,而不是代码中的id:
<button id="iframeload">
$('.iframeload').click(function(event) {
第二个错误
看起来您想将ajax调用发送到与页面所在页面不同的域。因此,由于安全原因,浏览器通常会阻止来自同一来源的请求,因此阻止了它。
可能的解决方案
但是,如果您只想在单击按钮时显示iframe内容,则不需要ajax。
只需使用attr('scr',url)
$( document ).ready(function() {
$('#iframeload').on('click',function(event){
event.preventDefault();
event.stopImmediatePropagation();
var url = 'https://pecom.ru/ru/calc/?iframe=Y';
$('#abc_frame').attr('src', url);
});
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<button id="iframeload">Load Iframe</button>
<div id="iframe_content">
<iframe name="abc_frame" id="abc_frame" src="about:blank" frameborder="0" scrolling="no"></iframe>
</div>
答案 2 :(得分:0)
我认为以下代码可以帮助您。您需要更改
$('。iframeload') 至 $('#iframeload') 因为您使用的是元素ID而不是类
完整代码如下
$('#iframeload').click(function(event) {
event.preventDefault();
event.stopImmediatePropagation();
$.ajax({
type: "POST",
url : "https://pecom.ru/ru/calc/?iframe=Y",
success : function (data) {
// alert('ok');
$("#iframe_content").html(data);
}
});
});
<script
src="https://code.jquery.com/jquery-3.3.1.min.js"
integrity="sha256-FgpCb/KJQlLNfOu91ta32o/NMZxltwRo8QtmkMRdAu8="
crossorigin="anonymous"></script>
<button id="iframeload">Load Iframe</button>
<div id="iframe_content"></div>
由于API,上面的代码不起作用