0
クラス.shorten-post
でAjaxレスポンス内のdivの高さを短くしたいと思います。ajax、Ajaxの成功時に各divの高さを短くします
私はこれだけはここにAJAX
var page = 1;
$(window).scroll(function() {
if ($(window).scrollTop() >= $(document).height() - $(window).height() - 100) {
page++;
loadMoreData(page);
}
});
function loadMoreData(page){
$.ajax(
{
url: '?page=' + page,
type: "get",
beforeSend: function()
{
$('.ajax-load').show();
}
})
.done(function(profcontent)
{
if(profcontent == ""){
$('.ajax-load').html("No more records found");
return;
}
$('.ajax-load').hide();
$(profcontent).filter('.shorten-post').each(function(){
if ($(this).height() > 100) {
$(this).height(50).css({ 'overflow': 'hidden'});
$(this).siblings('.toggle-shorten-post').show();
}});
$(profcontent).insertBefore("#post-data");
})
.fail(function(jqXHR, ajaxOptions, thrownError)
{
alert('server not responding...');
});
}
EDIT
を処理するための私のスクリプトが要約され、現在で
ではなく、ドキュメント全体よりもAJAX応答でものを短縮したいです私のprofcontentのコードの
<div id="tu_mainpost_<?php echo($current_post['slug_unique']); ?>" class="tu-post">
<div class="tu-post-header">
</div>
<div class="tu-post-image alt-grid shorten-post">
<div class="row">
<img class="img-responsive" src="<?php echo(base_url('assets/img/uploads/' . $current_post['source_img'])); ?>" style="width: 100%; height: inherit;">
</div>
<div class="row">
<div class="col-md-12 tu-main-description" style="margin: 10px 0px;">
<div class="tu-main-description">
<p class="wordbreak"><?php echo nl2br($current_post['description']); ?></p>
</div>
</div>
</div>
</div>
</div>
ここで 'profcontent'とは何ですか?サーバーからレンダリングされたコンテンツですか?また、このコードを実行するとエラーが発生していますか? – sbr
はい、profコンテンツはサーバーからのレンダリングされたコンテンツであり、エラーはありません。レンダリングされたコンテンツは返されますが、クラス{.shorten-post}のdivは高さを短くしません –
質問やcodepen/jsfiddleにできるだけ 'profcontent'を投稿できますか?それが問題の発見に役立ちます。 – sbr