Question

我想制作一个系统，用户点击页码，带有页面ID的div作为ID显示块，而其余的则不显示。

以下是我的代码：

<script type="text/javascript">
//initialize page divs
$('#page-1').css('display', 'none');
$('#page-2').css('display', 'none');
</script>
<?php
if(isset($_GET['page'])){
    $page = $_GET['page']; ?>
    <script type="text/javascript">
        $('#page-<?php echo $page; ?>').css('display', 'block');
    </script><?php
} else {
    $page = "1"; ?>
    <script>
        $('#page-<?php echo $page; ?>').css('display', 'block');
    </script><?php
}
?>

div使用array_chunk（）函数在foreach循环中回显。在回声出来之前，这是div的形式：

<?php
    $page_num = '0';
    foreach (array_chunk($articles, 9, true) as $pre_array) {
        $page_num = $page_num +1;
        $div_id = "<div id=\"article-page\" class=\"page-". $page_num ."\">";
        echo $div_id;
        foreach (array_chunk($pre_array, 3, true) as $array){
        echo '<div class="section group">';
        foreach ($array as $article) { ?>
                <div class="col span_1_of_3"><a href="article.php?id=<?php echo $article['article_id']; ?>"><?php echo $article['article_title']; ?></a><br /> <?php $article_content = $article['article_content']; if(strlen($article_content)<30) { echo $article_content; } else { echo("" . substr($article_content, 0, 30) . "..."); }?><br /><small>Posted <?php echo date('l dS F Y', $article['article_timestamp']); ?></small></div>
            <?php }
        echo '</div>';
        }
        echo '</div>';
    } ?>

最终结果例如是

<div id="article-page page-1">

我尝试过使用内联样式并让JS更改它，我也使用了php if语句然后在语句中使用html来获取样式标签来改变它。

没有运气......请帮助。

Answer 1

id不应包含空格。

由于HTML元素只能有一个id，但是，

它可以有多个由空格分隔的class个。

但是，class可以有。

因此：

<div id=\"article-page page-". $page_num ."\">

将其更改为

<div id=\"article-page" class=\"page-". $page_num ."\">

相应地做出改变，它必须有效。

请参阅下面的更正代码：

<script type="text/javascript">
//initialize page divs
$('.page-1').css('display', 'none');
$('.page-2').css('display', 'none');
</script>
<?php
$page = (isset($_GET['page'])) ? $_GET['page'] : 1;
?>
<script type="text/javascript">
  $('.page-<?php echo $page; ?>').css('display', 'block');
</script>

编辑：

<script type="text/javascript">
$(function(){
  $('.page-<?php echo $page; ?>').css('display', 'block');
});
</script>

Answer 2

您的ID包含空格，请尝试使用类。或者您可以使用它并在jQuery中将其称为$('#article-page page-". $page_num ."').css(......)

根据URL（GET）使DIV显示无或阻止

2 个答案: