jQuery模式在关闭和打开后不显示名称。

I create my custom modal window where i show image and that image contain comments and owner name. When i click on some image modal is opened and show big image, author name, comments etc... Problem is when i close current modal and opent it again name does not exist. But first time when i open modal name is there but only when i close that window and opent it again name does not exist. Check screenshots. I try to debug it with firebook console and GET response return real name but that name is not rendered after closing and opening.

我创建我的自定义模态窗口，在那里我显示图像，图像包含注释和所有者名。当我点击一些图像模式时，打开并显示大图像、作者姓名、评论等……问题是当我关闭当前模式时，它又不存在名称。但是第一次当我打开模式名时，只有当我关闭那个窗口时，它的名字就不存在了。检查屏幕截图。我尝试使用firebook控制台调试它，并获得响应返回真实名称，但该名称在关闭和打开之后没有呈现。

To prview image i use this code:

对于prview图像，我使用以下代码:

   preview: function() {
        $('body').on('click', '#open-picture-modal', function (e) {
            e.preventDefault();

            $("#photo_preview").show();
            var $this = $(this);
            var guid = $this.data('guid');
            var photo_id = $this.data('id');

            $.ajax({
                method: 'post',
                dataType: 'json',
                url: baseurl + '/photo/preview',
                data: {'photo_id': photo_id},
                success: function(data) {
                    Photo.photo_author_meta(photo_id);
                    $(".pleft").html('<img class="fileUnitSpacer" src="'+ $this.data('href')+data['photo_name']+'">');
                }
            });

            //window.history.pushState(null, null, pic_url);

          //  $(".image-source").attr("src", $this.data('href'));
        });
    },

    // Close image preview modal
    close: function() {
        $("body").on("click", ".close", function(e) {
            e.preventDefault();
            $('#photo_preview').hide();
            $('#photo_preview .pleft').html('empty');
            $('#photo_preview .pright').html('empty');
        });
    },

    // Show photo author meta(name, date created, etc..)
    photo_author_meta: function(pid){
        $.ajax({
            method: "post",
            dataType: 'json',
            url: baseurl + '/photo/photo_details',
            data: {'post_id': pid},
            success: function(data) {
                $("h4.photo-author-full-name").html(data['account_firstname'] +'&nbsp;'+ data['account_lastname']);
            }
        });
    },

And here is modal where i append and set html

这是我添加和设置html的modal

<div id="photo_preview" style="display:none">
    <div class="photo_wrp">
        <span class="pull-right close fa fa-times"> </span>
        <div style="clear:both"></div>
        <div class="pleft"></div>
        <div class="pright">
            <div class="photo-author-meta">
                <div class="media">
                    <a href="#" class="media-left">
                        <img alt="64x64" data-src="holder.js/64x64" class="media-object" style="width: 64px; height: 64px;" src="test.png" data-holder-rendered="true">
                    </a>
                    <div class="media-body photo-author-name-box">
                        <div class="photo-author-name">
                            <h4 class="media-heading photo-author-full-name"></h4>
                        </div>
                        <div class="photo-datetime-box">
                            <div class="photo-date-posted"> Objavljeno: </div>
                        </div>
                    </div>
                </div>
            </div>        </div>
        <div style="clear:both"></div>
    </div>
</div>

Like u can see on first image i have firstname and lastname in modal. On second image i open again the some modal but name and surname does not exist. But check firebug console, data exist but not rendered.

就像你在第一幅图中看到的一样，我有名字和名字。在第二幅图上我又打开了一些模态但是名字和姓氏不存在。但是检查firebug控制台，数据存在但未呈现。

2 个解决方案

#1

You have various things:

你有各种各样的东西:

1 - You are messing with .html() and .empty():

1 -你把。html()和。empty()搞混了:

$('#photo_preview .pleft').html(); // or .empty()

2 - As you delete all the content from #photo_preview .pright, when you do:

2 -当你删除#photo_preview .pright的所有内容时:

$("h4.photo-author-full-name").html(data['account_firstname'] +'&nbsp;'+ data['account_lastname']);

This element don't exist. You could create it, or not empty all the div content.

该元素不存在。您可以创建它，或者不清空所有div内容。

You could change this:

你能改变这个:

$('#photo_preview .pright').html(); // or .empty()

来

$('h4.photo-author-full-name').html(); // or .empty()

In order to no delete the element, only the content on it.

为了不删除元素，只删除元素上的内容。

#2

Your close method is removing the HTML that renders the meta data.

您的close方法是删除呈现元数据的HTML。

$('#photo_preview .pright').html('empty');

That line is emptying all the HTML within . So, when photo_author_meta() is called a subsequent time after closing, h4.photo-author-full-name no longer exists.

这一行将清空所有的HTML。因此，当photo_author_meta()在关闭后被调用时，为h4。photo-author-full-name已不复存在。

#1