我创建我的自定义模式窗口,在其中显示图像,该图像包含注释和所有者名称。当我单击某些图像模态时,打开并显示大图像,作者姓名,评论等。问题是当我关闭当前模态并再次打开时,名称不存在。但是第一次当我打开模式名称时,但是只有当我关闭该窗口并再次打开它时,该名称才不存在。检查屏幕截图。我尝试使用firebook控制台对其进行调试,并且GET响应返回真实名称,但是在关闭和打开后不会呈现该名称。
要预览图像,我使用以下代码:
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'] +' '+ data['account_lastname']);
}
});
},
这是我附加并设置html的模式
<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>
就像您可以在第一张图片上看到的那样,我在模态中具有名字和姓氏。在第二张图片上,我再次打开一些模态,但是名称和姓氏不存在。但是检查萤火虫控制台,数据存在但不呈现。
您有各种各样的事情:
1-您搞砸了.html()和.empty():
$('#photo_preview .pleft').html(); // or .empty()
2-当您从中删除所有内容#photo_preview .pright
时,执行以下操作:
$("h4.photo-author-full-name").html(data['account_firstname'] +' '+ data['account_lastname']);
该元素不存在。您可以创建它,也可以不清空所有div内容。
您可以更改此:
$('#photo_preview .pright').html(); // or .empty()
至
$('h4.photo-author-full-name').html(); // or .empty()
为了不删除该元素,只保留其中的内容。
本文收集自互联网,转载请注明来源。
如有侵权,请联系[email protected] 删除。
我来说两句