php - добавить класс: активный в div в зависимости от строки запроса

Question

php - добавить класс: активный в div в зависимости от строки запроса

0

Я пытаюсь изменить css div, основанный на ветке смородины страницы, цель состоит в том, чтобы показать, какая ссылка в данный момент активна в левом меню.

Формат URL-адреса будет WWW.mysite.co.uk/Folder/Folder2/Page.php?id=1

HTML

    <div id="Left-Menu">

    <div id="Left-Menu-Title"><p id="Left-Menu-Title-Text">Title</p>
    </div>

    <a href="?id=1"><div class="Left-Menu-Button">
    <p class="Left-Menu-Button-Text" >Button1</p>
    </div></a>        

    <a href="?id=2"><div class="Left-Menu-Button">
    <p class="Left-Menu-Button-Text" >Button2</p>
    </div></a>

    <a href="?id=3"><div class="Left-Menu-Button">
    <p class="Left-Menu-Button-Text" >Button3</p>
    </div></a>

    </div>

CSS

    #Left-Menu-Title{
padding-top:20px;
padding-bottom:20px;
    }

    #Left-Menu-Title-Text{
padding-left:8px;
font-size:0.85em;
font-family:segoe UI;
line-height:16px;
color:#5b0400;
    }

   .Left-Menu-Button{
width:69px;
height:20px;
margin-bottom:5px;
    }

    p.Left-Menu-Button-Text{
padding-left:8px;
padding-top:1px;
font-size:0.95em;
font-family:segoe UI;
color:#a61407;
    }

    .Left-Menu-Button:hover{
background-color:#a61407;
opacity:0.6;
filter:alpha(opacity=60);
    }

    .Left-Menu-Button:hover p.Left-Menu-Button-Text, .Left-Menu-Button.hover p.Left-Menu-Button-Text {
display: block;
color:#ffffff;
    }

    .active{
width:69px;
height:20px;
margin-bottom:5px;
background-color:#a61407;
    }

    p.active{
padding-left:8px;
padding-top:1px;
font-size:0.95em;
font-family:segoe UI;
color:#ffffff;
    }

    a{
text-decoration:none;
    }

Как добавить класс: активный к кнопке "Левое меню" и "Левое меню-Кнопка-Текст", когда href= тот же идентификатор, что и запрос.

Я считаю, что вы можете добавить класс: активный в тег, выполнив следующее:

    <a href="?id=1" <?php
    if($_SERVER['QUERY_STRING'] == "?id=1")
   {
    echo ' class="active" ';
   }
   ?>
   ><div class="Left-Menu-Button">
    <p class="Left-Menu-Button-Text" >Button1</p>
    </div></a>

Но возможно ли вместо этого перехватить левое меню и левое меню-Button-Text.

user2972392 09 нояб. 2013, в 19:30

Источник

Теги:

php

jquery

html

css

4 ответа

Ещё вопросы

Dan Cameron · Answer 1 · 2013-11-09T16-15-00.000Z

Используйте переменную PHP $ _GET.

<a href="?id=1" <?php if ( isset( $_GET['id'] ) && $_GET['id'] == 1 ) echo 'class="active"' ?>>
    <div class="Left-Menu-Button">
    <p class="Left-Menu-Button-Text" >Button1</p>
    </div>
</a>

Или добавьте его в атрибут класса, чтобы добавить другие классы.

<a href="?id=1" class="<?php if ( isset( $_GET['id'] ) && $_GET['id'] == 1 ) echo "active " ?>new_class">
    <div class="Left-Menu-Button">
    <p class="Left-Menu-Button-Text" >Button1</p>
    </div>
</a>

Просто не забудьте изменить значение id == 1 на элемент.

isset() используется так, что вы не проверяете неопределенную переменную, если в схеме URL-адреса страницы нет id в качестве строки запроса.

Я не уверен, почему кто-то понизит этот ответ, если это рабочее решение без лишних слов и безумно плохой разметки, как другие «ответы».
Это выглядит как правильный ответ, если предположить, что моя интерпретация вопроса верна. При этом, возможно, он хочет также добавить «активный» к абзацу «Left-Menu-Button-Text». В опубликованной таблице стилей есть класс p.active.

Michael St Clair · Answer 2 · 2013-11-09T16-34-00.000Z

Если я правильно понимаю ваш вопрос, этот код должен это сделать. Я считаю, что вы пытаетесь сделать ссылку активной, если это текущая страница, на которой вы находитесь. Просто добавьте этот код внутри своего класса "".

<?php
if(isset($_GET['id']) AND $_GET['id'] == 1)
   {
    echo ' active';
   }
?>

не работает, чтобы отобразить в месте, где это делает OP ... просто добавит это как текст между HTML-тегами
Разве это не то, что он хочет, это текст класса, который будет отображаться между тегами HTML
хорошо, я вижу, что теперь у него уже есть набор классов, и он хочет добавить к нему

Guilherme Soares · Answer 3 · 2013-11-09T16-13-00.000Z

<?php
$id = false;
if(isset($_GET['id']){
   $id = $_GET['id'];
}

?>

HTML...

<?php if($id == '1'): ?>
  <a href="?id=1" class="active">
<?php else: ?>
  <a href="?id=1">
<?php endif; ?>

ggdx · Answer 4 · 2013-11-09T15-17-00.000Z

Может быть, что-то вроде

<?php 
$classActive = NULL;
if($_GET["id"] == 1){
    $classActive = " active";
}
?>
<a href="?id=1">
    <div class="Left-Menu-Button<?php echo $classActive; ?>">
        <p class="Left-Menu-Button-Text<?php echo $classActive; ?>" >Button1</p>
    </div>
</a>