首页 文章

如何通过ajax在div中加载iframe

提问于
浏览 次
0

我想通过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 <iframe id =“pecom-kabinet-iframe”allowtransparency =“true”frameborder =“0”width =“800”height =“1800”scrolling =“auto”style =“border：0;” src =“https://pecom.ru/ru/calc/?iframe=Y”>不支持浏览器</ iframe>

按钮#iframeload不起作用......

javascript jquery html ajax iframe

2 回答

  • 0

    First Error

    您正在使用元素类，而不是代码中的id：

    <button id="iframeload">
$('.iframeload').click(function(event) {

    Second Error

    看起来您希望将ajax调用到与您的页面不同的域 . 因此浏览器会阻止它，因为出于安全原因，它通常允许同一来源的请求 .

    Possible Solution

    但是，如果您只想在按钮单击时显示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>
    回复于
  • 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，上述代码无效

    回复于

相关问题