Question

情景：

'家长页'包含两个iframe，'activity_overview'和'upload_avatar'。 “Activity_Overview”包含同一域中的页面。 'upload_avatar'还包含同一域的页面，该域包含表单。当提交“upload_avatar”中的表单（提交新的头像img）时，它会自动在“activity_overview”窗口中打开一个新页面，其中包含上传的图像。

我想做的是从这个图片中获取img src并将其传递给我父页面中的几个div，以便这些图像随着'activity_overview'的重新加载一起刷新（或不久之后） iframe中。

我尝试了很多东西，包括将src作为变量传递，从php到js，setInterval继续检查是否定义了img var ..etc。以下代码对我来说似乎最简单和理想，但未检测到iframe中的页面重新加载。

$(document).ready(function(){
  function avatarUpdate(){
    $('#avatar-crop-submit').click(function () {
        $('#avatar-upload-form').submit(function() {
            $('#avatar-upload-form').attr('target','activity_overview');
            window.parent.$("#overview-list, #overview").addClass('active');
            window.parent.$("#edit-list, #edit").removeClass('active');
            window.parent.$('#upload_avatar').attr('src', 'www.example.com/form/');
            $('#activity_overview').on('load', function(){
                var avatar_src = $('#temp_header_avatar img').attr('src');
                window.parent.$('#header_avatar').html('<img src="' + avatar_src + '" class="avatar user-1-avatar avatar-150 photo" width="150" height="150" alt="Profile Photo">').hide().fadeIn(1000);
                window.parent.$('#nav_avatar').html('<img src="' + avatar_src + '" class="avatar img-circle user-1-avatar avatar-60 photo" width="60" height="60" alt="Profile Photo">').hide().fadeIn(1000);
            });
        });
    });
  }       
  avatarUpdate();
});

我认为this question可能有一些相关性，但我不确定如何实施解决方案。

Answer 1

感谢@gp以及他对js需要调用的地方的澄清，我得到了它。

我将以下代码放入正在加载到iframe的页面中，并且可以根据需要运行。

    $(window).load(function() {
      function getAvatarSrc(){
        var avatar_src = $('#temp_header_avatar img').attr('src');
        window.parent.$('#header_avatar').html('<img src="' + avatar_src + '" class="avatar user-1-avatar avatar-150 photo" width="150" height="150" alt="Profile Photo">').hide().fadeIn(1000);
        window.parent.$('#nav_avatar').html('<img src="' + avatar_src + '" class="avatar img-circle user-1-avatar avatar-60 photo" width="60" height="60" alt="Profile Photo">').hide().fadeIn(1000);
      };  
      getAvatarSrc();
    });

检测iframe重新加载，获取img src，应用于父

1 个答案: