Cách thêm class = 'active' vào menu html với php

Tôi muốn đặt điều hướng html của mình trong một tệp php riêng biệt vì vậy khi tôi cần chỉnh sửa nó, tôi chỉ phải chỉnh sửa nó một lần. Sự cố bắt đầu khi tôi muốn thêm lớp đang hoạt động vào trang đang hoạt động.Cách thêm class = 'active' vào menu html với php

Tôi có ba trang và một tệp phổ biến.

common.php:

<?php 
$nav = <<<EOD 
    <div id="nav"> 
     <ul> 
      <li><a <? if($page == 'one'): ?> class="active"<? endif ?> href="index.php">Tab1</a>/</li> 
      <li><a href="two.php">Tab2</a></li> 
      <li><a href="three.php">Tab3</a></li> 
     </ul> 
    </div> 
EOD; 
?>

index.php: Cả ba trang giống hệt nhau ngoại trừ trang $ của họ là khác nhau trên mỗi trang.

<?php 
    $page = 'one';  
    require_once('common.php'); 
    ?> 
    <html> 
     <head></head> 
     <body> 
      <?php echo $nav; ?> 
     </body> 
    </html>

Điều này sẽ không hoạt động trừ khi tôi đặt nav trên mỗi trang, nhưng sau đó toàn bộ mục đích tách nav khỏi tất cả các trang bị hủy hoại.

Tôi muốn đạt được điều gì thậm chí có thể? Tôi đang làm gì sai?

Cảm ơn

EDIT: Khi làm điều này, các mã php bên trong li dường như không chạy, nó chỉ được in như thể nó là html

Nguồn

2010-05-26 patad

Trước tiên, PHP không được phân tích cú pháp trong chuỗi heredoc (chỉ biến) và thứ hai, số nhận dạng đóng (tức là EOD) phải ở đầu dòng. –

vâng xin lỗi tôi biết điều đó, nghĩ rằng sẽ dễ dàng hơn để đọc nó như thế. EOD ở đầu dòng trong mã của tôi, đó không phải là vấn đề. Vấn đề của tôi là nó in chính xác những gì có trong EOD, cũng là php. – patad

lý do là in php là do lỗi cú pháp: nên là –

đang index.php của bạn là đúng. Tôi bao gồm các mã cập nhật cho common.php dưới đây sau đó tôi sẽ giải thích sự khác biệt.

<?php 
    $class = ($page == 'one') ? 'class="active"' : ''; 
    $nav = <<<EOD 
     <div id="nav"> 
      <ul> 
       <li><a $class href="index.php">Tab1</a>/</li> 
       <li><a href="two.php">Tab2</a></li> 
       <li><a href="three.php">Tab3</a></li> 
      </ul> 
     </div> 
EOD; 
?>

Vấn đề đầu tiên là bạn cần đảm bảo rằng tuyên bố kết thúc cho heredoc của bạn - EOD; - không thụt lề chút nào. Nếu nó bị thụt vào thì bạn sẽ gặp lỗi.

Đối với vấn đề của bạn với mã PHP không chạy trong tuyên bố heredoc, đó là bởi vì bạn đang nhìn nó sai. Sử dụng một tuyên bố heredoc không giống như đóng các thẻ PHP. Như vậy, bạn không cần phải thử mở lại chúng. Điều đó sẽ không làm gì cho bạn. Cách cú pháp heredoc hoạt động là mọi thứ giữa mở và đóng được hiển thị chính xác như được viết với ngoại lệ của các biến. Chúng được thay thế bằng giá trị liên quan. Tôi đã loại bỏ logic của bạn khỏi heredoc và sử dụng chức năng đại học để xác định lớp học để dễ thấy hơn (mặc dù tôi không tin bất kỳ câu lệnh logic nào cũng sẽ hoạt động trong heredoc)

Để hiểu cú pháp heredoc, nó . được giống như bao gồm nó trong dấu ngoặc kép ("), nhưng mà không cần thoát vì vậy, mã của bạn cũng có thể được viết như thế này:

<?php 
    $class = ($page == 'one') ? 'class="active"' : ''; 
    $nav = "<div id=\"nav\"> 
      <ul> 
       <li><a $class href=\"index.php\">Tab1</a>/</li> 
       <li><a href=\"two.php\">Tab2</a></li> 
       <li><a href=\"three.php\">Tab3</a></li> 
      </ul> 
     </div>"; 
?>

nó sẽ làm chính xác những điều tương tự, chỉ được viết hơi khác nhau Một sự khác biệt giữa heredoc và chuỗi là bạn có thể thoát ra khỏi chuỗi ở giữa, nơi bạn không thể ở trong heredoc Sử dụng logic này, bạn có thể sản xuất các mã sau đây:

<?php 
    $nav = "<div id=\"nav\"> 
      <ul> 
       <li><a ".(($page == 'one') ? 'class="active"' : '')." href=\"index.php\">Tab1</a>/</li> 
       <li><a href=\"two.php\">Tab2</a></li> 
       <li><a href=\"three.php\">Tab3</a></li> 
      </ul> 
     </div>"; 
?>

Sau đó, bạn có thể bao gồm logic trực tiếp trong chuỗi như bạn dự định ban đầu.

Bất kỳ phương pháp nào bạn chọn đều tạo ra rất ít sự khác biệt (nếu có) về hiệu suất của tập lệnh. Nó chủ yếu là sở thích. Dù bằng cách nào, bạn cần phải chắc chắn rằng bạn hiểu cách thức hoạt động của từng công trình.

Nguồn

2010-05-26 14:08:38 Joseph

cảm ơn rất nhiều vì điều đó! mọi thứ hợp lý với tôi! – patad

vì vậy, điều tốt nhất là tạo một tệp nav.php mới như Toader Mihai Claudiu gợi ý, hoặc đơn giản là sử dụng ". (($ Page == 'one')? 'Class =" active "': '')." trong chuỗi? vì cả hai cách đều hoạt động .. – patad

Tôi nghĩ rằng bạn cần phải đặt $page = 'one'; của bạn ở trên các require_once .. nếu không tôi không hiểu câu hỏi.

Nguồn

2010-05-26 13:36:50 CharlesLeaf

Xin chào! Không có sự khác biệt nếu tôi đặt $ page trước hoặc sau require_once. Nó vẫn in giống như vậy:

class="active" href="index.php">Tab1 /
Tab2
Tab3

– patad

PHP không được phân tích cú pháp trong chuỗi heredoc. –

Ah chờ đợi tôi bỏ qua một cái gì đó. Bạn có toàn bộ mã của bạn bên trong một khối '<<< EOD'. Mã PHP bạn có bên trong sẽ không được phân tích cú pháp. Hãy thử xóa 2 dòng đầu tiên và 2 dòng cuối cùng trong tệp common.php của bạn. (vì vậy bạn chỉ còn lại HTML). – CharlesLeaf

Tại sao bạn không tạo hàm hoặc lớp cho điều hướng này và đặt trang hoạt động đó làm thông số? Bằng cách này bạn muốn gọi nó là như, ví dụ:

$navigation = new Navigation(1);

hoặc

$navigation = navigation(1);

Nguồn

2010-05-26 13:41:39

tại sao bạn không làm điều đó như thế này:

trong các trang:

<html> 
    <head></head> 
    <body> 
     <?php $page = 'one'; include('navigation.php'); ?> 
    </body> 
</html>

trong navigation.php

<div id="nav"> 
    <ul> 
     <li> 
      <a <?php echo ($page == 'one') ? "class='active'" : ""; ?> 
       href="index1.php">Tab1</a>/</li> 
     <li> 
      <a <?php echo ($page == 'two') ? "class='active'" : ""; ?> 
        href="index2.php">Tab2</a>/</li> 
     <li> 
      <a <?php echo ($page == 'three') ? "class='active'" : ""; ?> 
        href="index3.php">Tab3</a>/</li> 
    </ul> 
</div>

Bạn thực sự sẽ có thể kiểm soát vị trí trong trang bạn đang đặt điều hướng và thông số nào bạn đang chuyển đến nó.

Chỉnh sửa sau: lỗi cú pháp cố định.

Nguồn

2010-05-26 13:42:38

So sánh mã của bạn và của anh ta (mà trong khi có vấn đề với việc sử dụng cú pháp heredoc của nó hoạt động tốt), tôi muốn đi vào mã xem xét của mình. Các biến được khai báo ở đầu trang và các biến được sử dụng để đặt điều hướng. Vấn đề định dạng đơn giản, nhưng sở thích cá nhân.Trong mọi trường hợp, trong khi câu trả lời của bạn là tốt, nó không giải quyết các câu hỏi được hỏi. – Joseph

tôi đã đổi thành và nó hoàn toàn hoạt động! THANKS bạn đá! – patad

Có một nguyên tắc mà tôi đến để yêu mến kể từ khi tôi bắt đầu lập trình. Nó được gọi là địa phương của thông tin. Về cơ bản bạn muốn có tất cả các thông tin cần thiết để lý do về một số mã gần chính nó. điều này cho phép bạn có thể quyết định tại địa phương về mục đích của một số đoạn mã và buộc bạn phải đi vào n nơi để thu thập thông tin đó. –

$page='one' nên xảy ra trước bạn require_once() không sau. Sau khi quá muộn - mã đã được yêu cầu và $nav đã được xác định.
Bạn nên sử dụng include('header.php'); và include('footer.php'); thay vì đặt sớm biến số $nav. Điều đó làm tăng tính linh hoạt.
Tạo nhiều chức năng hơn.Một cái gì đó như thế này thực sự làm cho mọi thứ dễ dàng hơn để làm theo:
```
function maybe($x,$y){return $x?$y:'';} 
function aclass($k){return " class=\"$k\" "; } 
```
sau đó bạn có thể viết "điều kiện" của bạn như thế này:
```
<a href="..." <?= maybe($page=='one',aclass('active')) ?>> .... 
```

Nguồn

2010-05-26 13:42:55 geocar

Tôi biết điều này là cũ, nhưng không ai trong số những câu trả lời là rất tốt (sry ppl)

Cách NHẤT để làm điều đó (mà không cần viết ra các lớp phức tạp) là so sánh $ _SERVER hiện tại [ 'REQUEST_URI' ] vào href của liên kết. Bạn đã gần tới.

Hãy thử điều này. (Lấy từ http://ma.tt/scripts/intellimenu/)

$nav = <<<EOD 
<div id="nav"> 
     <ul> 
      <li><a href="index.php">Tab1</a></li> 
      <li><a href="two.php">Tab2</a></li> 
      <li><a href="three.php">Tab3</a></li> 
     </ul> 
    </div> 
EOD; 

$lines = explode("\n", $nav); 
foreach($lines as $line) 
{ 
    if(preg_match('/href="([^"]+)"/', $line, $url)) { 
     if(substr($_SERVER['REQUEST_URI'], 0, 5) == substr($url[1], 0, 5)) { 
      $line = str_replace('><a', ' class="current-menu-item"><a', $line); 
     } 
    } 
    echo $line . "\n"; 
}

Nguồn

2011-05-06 21:08:08

Một giải pháp rất dễ giải quyết cho vấn đề này là làm điều này.

<ul> 
    <li class="<?php if(basename($_SERVER['SCRIPT_NAME']) == 'index.php'){echo 'current'; }else { echo ''; } ?>"><a href="index.php">Home</a></li> 
    <li class="<?php if(basename($_SERVER['SCRIPT_NAME']) == 'portfolio.php'){echo 'current'; }else { echo ''; } ?>"><a href="portfolio.php">Portfolio</a></li> 
    <li class="<?php if(basename($_SERVER['SCRIPT_NAME']) == 'services.php'){echo 'current'; }else { echo ''; } ?>"><a href="services.php">Services</a></li> 
    <li class="<?php if(basename($_SERVER['SCRIPT_NAME']) == 'contact.php'){echo 'current'; }else { echo ''; } ?>"><a href="contact.php">Contact</a></li> 
    <li class="<?php if(basename($_SERVER['SCRIPT_NAME']) == 'links.php'){echo 'current'; }else { echo ''; } ?>"><a href="links.php">Links</a></li> 
</ul>

nào sẽ ra

<ul> 
    <li class="current"><a href="index.php">Home</a></li> 
    <li class=""><a href="portfolio.php">Portfolio</a></li> 
    <li class=""><a href="services.php">Services</a></li> 
    <li class=""><a href="contact.php">Contact</a></li> 
    <li class=""><a href="links.php">Links</a></li> 
</ul>

Nguồn

2013-05-29 18:15:41 Lance

CALL common.php 
<style> 
    .ddsmoothmenu ul li{float: left; padding: 0 20px;} 
    .ddsmoothmenu ul li a{display: block; 
    padding: 40px 15px 20px 15px; 
    color: #4b4b4b; 
    font-size: 13px; 
    font-family: 'Open Sans', Arial, sans-serif; 
    text-align: right; 
    text-transform: uppercase; 
    margin-left: 1px; color: #fff; background: #000;} 
    .current .test{ background: #2767A3; color: #fff;} 
</style> 
<div class="span8 ddsmoothmenu"> 
<!-- // Dropdown Menu // --> 
<ul id="dropdown-menu" class="fixed"> 
    <li class="<?php if(basename($_SERVER['SCRIPT_NAME']) == 'index.php'){echo 'current'; }else { echo ''; } ?>"><a href="index.php" class="test">Home <i>::</i> <span>welcome</span></a></li> 
    <li class="<?php if(basename($_SERVER['SCRIPT_NAME']) == 'about.php'){echo 'current'; }else { echo ''; } ?>"><a href="about.php" class="test">About us <i>::</i> <span>Who we are</span></a></li> 
    <li class="<?php if(basename($_SERVER['SCRIPT_NAME']) == 'course.php'){echo 'current'; }else { echo ''; } ?>"><a href="course.php">Our Courses <i>::</i> <span>What we do</span></a></li> 
</ul><!-- end #dropdown-menu --> 

</div><!-- end .span8 --> 

add each page 
<?php include('common.php'); ?>

Nguồn

2015-04-17 09:09:05

   <ul> 

       <li><a <?php echo ($page == "yourfilename") ? "class='active'" : ""; ?> href="user.php" ><span>Article</span></a></li> 
       <li><a <?php echo ($page == "yourfilename") ? "class='active'" : ""; ?> href="newarticle.php"><span>New Articles</span></a></li> 

       </ul>

Nguồn

2016-02-01 10:49:29

Tâm chỉnh sửa câu trả lời của bạn và thêm mô tả chi tiết cho nó. – SOFe

Nếu bạn đang ở trên trang news.php có nghĩa là nó đã kích hoạt menu trang news.php hiện tại –

Giải pháp Tôi đang sử dụng là như sau và cho phép bạn thiết lập các lớp tích cực mỗi trang php.

Cung cấp cho từng mục menu của bạn một lớp duy nhất, tôi sử dụng .nav-x (nav-about, here).

<li class="nav-item nav-about"> <a class="nav-link" href="about.php">About</a> </li>

Ở phía trên cùng của mỗi trang (about.php đây):

<!-- Navbar Active Class --> 
<?php $activeClass = '.nav-about > a'; ?>

Ở những nơi khác (header.php/index.php):

<style> 
<?php echo $activeClass; ?> { 
    color: #fff !important; 
} 
</style>

Chỉ cần thay đổi .nav-about > a trên mỗi trang, .nav-forum > a, ví dụ.

Nếu bạn muốn kiểu dáng khác nhau (màu sắc vv) cho mỗi mục điều hướng, chỉ cần đính kèm kiểu nội tuyến vào trang đó thay vì trang chỉ mục/tiêu đề.

Nguồn

2016-10-14 23:10:26

tách riêng trang của bạn khỏi thanh điều hướng.

pageOne.php:

$page="one"; 
include("navigation.php");

navigation.php

if($page=="one"){$oneIsActive = 'class="active"';}else{ $oneIsActive=""; } 
if($page=="two"){$twoIsActive = 'class="active"';}else{ $twoIsActive=""; } 
if($page=="three"){$threeIsActive = 'class="active"';}else{ $threeIsActive=""; } 

<ul class="nav"> 
    <li <?php echo $oneIsActive; ?>><a href="pageOne.php">One</a></li> 
    <li <?php echo $twoIsActive; ?>><a href="pageTwo.php"><a href="#">Page 2</a></li> 
    <li <?php echo $threeIsActive; ?>><a href="pageThree.php"><a href="#">Page 3</a></li> 
</ul>

tôi thấy rằng tôi cũng có thể đặt tiêu đề của trang web của tôi với phương pháp này là tốt.

$page="one"; 
$title="This is page one." 
include("navigation.php");

và chỉ lấy tiêu đề $ var và đặt nó vào giữa thẻ "tiêu đề". Mặc dù tôi đang gửi nó đến trang tiêu đề của tôi phía trên thanh điều hướng của tôi.

Nguồn

2016-12-20 11:19:33 kmxdx

Bạn có thể sử dụng PHP này, hy vọng nó sẽ giúp ích.

<?php if(basename($_SERVER['PHP_SELF'], '.php') == 'home') { ?> class="active" <?php } else { ?> <?php }?>

Vì vậy, danh sách sẽ như sau.

<ul> 
    <li <?php if(basename($_SERVER['PHP_SELF'], '.php') == 'home') { ?> class="active" <?php } else { ?> <?php }?>><a href="home"><i class="fa fa-dashboard"></i> <span>Home</span></a></li> 
    <li <?php if(basename($_SERVER['PHP_SELF'], '.php') == 'listings') { ?> class="active" <?php } else { ?> <?php }?>><a href="other"><i class="fa fa-th-list"></i> <span>Other</span></a></li> 
</ul>

Nguồn

2017-07-21 12:02:39 Murkle

Cách thêm class = 'active' vào menu html với php

Trả lời

Các vấn đề liên quan