每次打开对话框时如何重新加载包含 iframe 的 jquery 对话框的 src？答案

【问题标题】：How to reload the src of an iframe contained jquery dialog each time the dialog is opend?每次打开对话框时如何重新加载包含 iframe 的 jquery 对话框的 src？
【发布时间】：2014-01-03 04:37:46
【问题描述】：

我有一个这样的对话框

<div id="dialog">
  <iframe id="myIframe" src=""></iframe>
</div>
<button id="opener1">Open Dialog</button>
<button id="opener2">Open Dialog</button>

我的脚本如下

$(function () {
  $("#dialog").dialog({
    autoOpen: false,
    show: "fade",
    hide: "fade",
    modal: true,
    height: 'auto',
    width: 'auto',
    resizable: true,
    title: 'Vessels'
  });

  $("#opener1").click(function () {
    $('#myIframe').src = 'http://www.w3schools.com';
    $("#dialog").dialog("open");
    return false;
  });

  $("#opener2").click(function () {
    $('#myIframe').src = 'http://www.google.com';
    $("#dialog").dialog("open");
    return false;
  });
});

我想在显示对话框之前动态设置 iframe 的 url。我尝试了上面的代码，但没有工作

【问题讨论】：

stackoverflow.com/questions/7551912/…
是的..我试过了..这是有效的..但是看到这个..jsfiddle.net/krishanudey/94KUB当你点击一个按钮并关闭对话框然后点击其他按钮时，最初它显示以前页。我不会发生这种情况......

标签： javascript jquery iframe jquery-dialog

【解决方案1】：

你可以试试这个

$(function () {
    $("#dialog").dialog({
        autoOpen: false,
        show: "fade",
        hide: "fade",
        modal: true,
        height: 'auto',
        width: 'auto',
        resizable: true,
        title: 'Vessels',
        close: function( event, ui ) {
           $('#myIframe').attr('src', '');
         }
    });

    $("#opener1").click(function () {
        $('#myIframe').attr('src', 'http://www.w3schools.com');
        $("#dialog").dialog("open");
        return false;
    });

    $("#opener2").click(function () {
        $('#myIframe').attr('src', 'http://www.example.com/');
        $("#dialog").dialog("open");
        return false;
    });
});

关闭对话框时只需将iframe src 设置为empty

演示：http://jsfiddle.net/94KUB/3/

【讨论】：

【解决方案2】：

试试这个，

$('#myIframe')[0].src = 'http://www.w3schools.com';

或使用attr() 喜欢，

$('#myIframe').attr('src','http://www.google.com');

Demo

【讨论】：

【解决方案3】：

您不能直接设置来源。您必须像这样更改 iframe 的 src 属性：

$('#myIframe').attr('src','http://www.w3schools.com');

【讨论】：

是的..我试过了..这是工作..但是看到这个..jsfiddle.net/krishanudey/94KUB当你点击一个按钮并关闭对话框然后点击其他按钮时，最初它显示以前页。我不会发生这种情况......