Question

我的页面中有几篇文章

<article></articles>

每篇文章都有一个由PHP变量data-price="<?php echo $pret[1] ?>"回显的动态ID。

加载更多按钮是：

<div id="loadMore"><a> mai multe rezultate</a></div></div>

代码是：

<script type="text/javascript">
$(document).ready(function () {
    $('#hotel-list article:gt(4)').hide();
    $('#loadMore').click(function () {
        $('#hotel-list article:hidden:lt(2)').show();
    });
    $('#showLess').click(function () {
        $('#hotel-list article').not(':lt(4)').hide();
    });
});
</script>

如何使此代码正常工作并在点击时加载更多文章，但如果任何文章的空ID仍然隐藏。

Answer 1

试试这个脚本。 Here是JSFiddle。在此示例中，单击“加载更多”时隐藏了第7条和第9条，因为data-price为空（我不知道为什么要将Id存储在名为data-price的属性中）。

 $(document).ready(function () {
     $('#hotel-list article:gt(4)').hide();
     $('#loadMore').click(function () {
         $('article').filter(function () {
             return $(this).data('price') != '' && $(this).css("display") == "none"
         }).show();
     });
     $('#showLess').click(function () {
         $('#hotel-list article').not(':lt(4)').hide();
     });
 });

Answer 2

您可以使用PHP + $ getJson

PHP :: getid_data.php

<?php

$pret = array();

echo json_encode($pret);

?>

jQuery（$ getJSON）

$(function () {
    'use strict';    
    $.getJSON('getid_data.php', function(data) {
        $.each(data, function(key, val) {
            $('#hotel-list article' + val.id).css('display', 'none')
        });
    });
});

在PHP中，您只能填写应显示的ID，然后在jquery中，您可以将选择器更改为$('#hotel-list :not(article' + val.id + ')')

加载更多动作jquery

2 个答案: