Question

我有这段代码：

<div id="menu">
    <ul>
        <li><span id="menulabel">Your Languages</span></li>
        <?php
        $hotClass = '';
        $newClass = '';
        $topClass = '';
        if ($sort == 'hot')
            $hotClass = 'active';
        else if ($sort == 'new')
            $newClass = 'active';
        else if ($sort == 'top')
            $topClass = 'active';
        ?>
        <li><a id="Hot" href="index.php?sort=hot&page=1" class="<?php echo $hotClass; ?>">Hot</a></li>
        <li><a id="New" href="index.php?sort=new&page=1" class="<?php echo $newClass; ?>">New</a></li>
        <li><a id="Top" href="index.php?sort=top&page=1" class="<?php echo $topClass; ?>">Top</a></li>
    </ul>
</div>

根据页面使用的排序，突出显示不同的菜单项以显示用户。但是，我真的不喜欢这个代码，因为当列表项不活动时，类是空的而不是不存在。而且，每个if语句基本上都是一样的。有可能将它重构为更优雅和可读的东西吗？感谢。

Answer 1

你可以考虑在这里使用三元组......

<div id="menu">
    <ul>
        <li><span id="menulabel">Your Languages</span></li>
        <li><a id="Hot" href="index.php?sort=hot&page=1" class="<?php echo ($sort == 'hot') ? 'active' : '' ?>">Hot</a></li>
        <li><a id="New" href="index.php?sort=new&page=1" class="<?php echo ($sort == 'new') ? 'active' : '' ?>">New</a></li>
        <li><a id="Top" href="index.php?sort=top&page=1" class="<?php echo ($sort == 'top') ? 'active' : '' ?>">Top</a></li>
    </ul>
</div>

绝对可以节省大量代码

如果您不熟悉Ternary Operator

(condition) ? 'result if true' : 'result if false'

修改

正如Matijs指出的那样

您甚至可以将整个类声明放在运算符中，以避免以class=""
结尾
<li><a id="Hot" href="index.php?sort=hot&page=1" <?php echo ($sort == 'hot') ? 'class="hot"' : '' ?> >Hot</a></li>`

Answer 2

使用'hot''new'和'top作为案例进行切换，或者，如果第一个字符串与'$ sort'值匹配，则采用两个字符串的方法，然后将第二个字符串设置为活动

Answer 3

<div id="menu">
<ul>
    <li><span id="menulabel">Your Languages</span></li>
    <li><a id="Hot" href="index.php?sort=hot&page=1" class="<?php echo ($sort=='hot')?'active':''; ?>">Hot</a></li>
    <li><a id="New" href="index.php?sort=new&page=1" class="<?php echo ($sort=='new')?'active':''; ?>">New</a></li>
    <li><a id="Top" href="index.php?sort=top&page=1" class="<?php echo ($sort=='top')?'active':''; ?>">Top</a></li>
</ul></div>

如果未启用“short_tags”。如果它们已启用，您可以将＆lt;？php echo“替换为”＆lt;？=“

Answer 4

也许使用循环和数组？

<div id="menu">
  <ul>
    <li><span id="menulabel">Your Languages</span></li>
      <?php 
    foreach(array("Hot","New","Top") as $Id) {
      $class = '';
      if ($sort == strtolower($Id)) $class = 'active';
      echo "<li><a id='$Id' href='index.php?sort=".strtolower($Id)."&page=1' class='$class'>$Id</a></li>";
    }
    ?>
    </li>
  </ul>
</div>

Answer 5

这是另一个重复较少的建议。

<?php
function sortClass($val) {
  return ($sort == $val) ? 'class="active"' : '';
}
?>
<li><a id="Hot" href="index.php?sort=hot&page=1" <?=sortClass('hot');?> >Hot</a></li>
<li><a id="New" href="index.php?sort=new&page=1" <?=sortClass('new');?> >New</a></li>
<li><a id="Top" href="index.php?sort=top&page=1" <?=sortClass('top');?> >Top</a></li>

Answer 6

由于你在这里处理演示文稿（即添加一个很可能只是改变外观的CSS类），你也可以使用JavaScript（ala Progressive Enhancement）来应用样式：

<div id="menu" data-sort="<?php echo $sort; ?>">
    <ul>
        <li><span id="menulabel">Your Languages</span></li>
        <li><a id="hot" href="index.php?sort=hot&page=1">Hot</a></li>
        <li><a id="new" href="index.php?sort=new&page=1">New</a></li>
        <li><a id="top" href="index.php?sort=top&page=1">Top</a></li>
    </ul>
</div>

<script type="text/javascript">
var sort = $("#menu").attr("data-sort"); // HTML5 FTW!
$("#menu li." + sort).addClass("active");
</script>

Answer 7

我能想到的另一种可能的方法是更改您的网址参数。试试这个：

<div id="menu">
    <ul>
        <li><span id="menulabel">Your Languages</span></li>
        <li><a id="Hot" href="index.php?hot=active&page=1" class="<?php echo $_GET['hot']; ?>">Hot</a></li>
        <li><a id="New" href="index.php?new=active&page=1" class="<?php echo $_GET['new']; ?>">New</a></li>
        <li><a id="Top" href="index.php?top=active&page=1" class="<?php echo $_GET['top']; ?>">Top</a></li>
    </ul>
</div>

如何重构这些if语句？

7 个答案: