如何使用 Jquery 在 iframe 中加载 url

Question

我想在点击时加载 iframe，这就是我到目前为止所拥有的：

$("#frame").click(function () { 
      $('this').load("http://www.google.com/");
    });

它不起作用。这是完整的代码： JS Bin

Answer 1

$("#button").click(function () { 
    $("#frame").attr("src", "http://www.example.com/");
});

HTML：

 <div id="mydiv">
     <iframe id="frame" src="" width="100%" height="300">
     </iframe>
 </div>
 <button id="button">Load</button>

Answer 2

尝试 $(this).load("/file_name.html");。此方法针对本地文件。

您还可以定位远程文件（在另一个域上），请查看：http://en.wikipedia.org /wiki/Same_origin_policy

Answer 3

$("#frame").click(function () { 
    this.src="http://www.google.com/";
});

有时纯 JavaScript 比 jQuery 更酷、更快;-)

Answer 4

这是视图中的 Iframe：

<iframe class="img-responsive" id="ifmReport" width="1090" height="1200" >

    </iframe>

将其加载到脚本中：

 $('#ifmReport').attr('src', '/ReportViewer/ReportViewer.aspx');

Answer 5

以防万一有人仍然偶然发现这个老问题：

从某种意义上说，代码理论上几乎是正确的，问题在于使用 $('this') 而不是 $(this)，因此告诉 jQuery寻找标签。

$(document).ready(function(){
  $("#frame").click(function () { 
    $(this).load("http://www.google.com/");
  });
});

脚本本身不能像现在这样工作，因为 load() 函数本身是一个 AJAX 函数，并且 google 似乎没有明确允许使用 AJAX 加载此页面，但这个方法应该是易于使用，以便通过使用相对路径从您自己的域加载页面。