Скрыть / показать содержимое HTML с помощью переполнения стека

Я очень новичок в PHP, и я пытаюсь получить часть кода PHP для запуска внутри моего HTML-файла.

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

Я знаю, что с jquery вы должны вытащить библиотеку jquery перед запуском скрипта. Нужно ли делать это и с PHP?

Вот код, который я пытаюсь запустить:

Заранее спасибо!

html file

<?php
if ($dropmenuValue == specificDropDownOption) {
?>
<div>
-conditional content-
</div>
<?php
}
?>

0

Решение

Одна из главных особенностей PHP и других серверных языков заключается в том, что когда они отображают страницу, они закрываются, и все. Там нет ничего, что они могут сделать после.

Здесь вам нужно прибегнуть к клиентской части, возможно, самый простой способ — добавить значения переменных PHP в соответствующие переменные JavaScript, а затем взять их оттуда. Вам также нужно будет отобразить все возможное содержимое и показать только то, что вам нужно.

Таким образом, в вашем случае вы можете создать класс CSS для обозначения скрытого содержимого, а затем использовать JavaScript для скрытия / отображения различных частей разметки. Обратите внимание, что весь скрытый код (представленный PHP, но скрытый CSS) все еще виден в исходном коде страницы, поэтому, если у вас есть что-то чувствительное, вам следует определенно Делайте это, совершая AJAX-вызовы для загрузки частичного содержимого, или обычного перенаправления / навигации по страницам.


РЕДАКТИРОВАТЬ

Вот очень простой пример, который я сделал для вас, чтобы увидеть, как вы можете показать / скрыть контент:

HTML (части могут быть обработаны PHP, конечно)

<div id="content1" class="content">Hey</div>
<div id="content2" class="content hidden">There</div>
<div id="content3" class="content hidden">World</div>
<hr />
<button onclick="show(1)">Show 1</button>
<button onclick="show(2)">Show 2</button>
<button onclick="show(3)">Show 3</button>

JS

function show(id) {
// select all the content divs
var allDivs = document.getElementsByClassName('content');
// iterate over them and add a hidden class to each
for (var i = 0; i < allDivs.length; i++){
allDivs[i].classList.add('hidden');
}
// finally, remove the hidden class from the one we referenced
document.getElementById('content' + id).classList.remove('hidden');
}

Смотрите это в действии здесь: http://jsfiddle.net/f0onk7bk/

3

Другие решения

Вы можете попробовать что-то с этим … Используя HTML внутри PHP

#item { display: block;}#itme.active { display:none  }
0

Примерно так будет работать при загрузке / перезагрузке страницы …

<?php

if(isset($_POST['dropdown_name_here']) && $_POST['dropdown_name_here'] == "specificParameter")
{
echo("<div id='condition_one_div'> ... </div>");
}
else
{
echo("<div id='condition_two_div'> ... </div>");
}

?>

… но я думаю, что JavaScript — это то, что вы хотели бы использовать для динамического контента.

var div = document.getElementById('div_name_here');
var dropdown = document.getElementById('dropdown_name_here');
if(dropdown.value == "specificParameter")
{
//add/show content for div here
}
else
{
//hide content for div here
}

Это то, что вы ищите?

<select id='dropdown_name' onchange='if(this.value == "parameter"){ document.getElementById("div_name").style.display = "block"; }else{ document.getElementById("div_name").style.display = "none"; }' >
</select>
0
По вопросам рекламы ammmcru@yandex.ru
Adblock
detector