Нужна помощь в динамическом управлении страницей

Question

Я хочу создать страницу, на которой пользователь сделает выбор, например: "Сколько лет вашему компьютеру?" - «Один год», «Два года» и т. Д. И т. Д., И на странице будут удалены и добавлены «опции» (которые на данный момент должны быть только информативными разделами текста)

Есть ли способ сделать что-то подобное?

Я использую технологии PHP и, конечно, HTML и CSS для стилизации страниц.

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

Answer 1

PHP не может определить, были ли внесены изменения в страницу, для этого вам придется использовать Javascript.

Если вы используете HTML-элемент select и хотите динамически создавать контент, он может выглядеть примерно так:
HTML

<select id="computerAge">
    <option>2 years</option>
    <option>3 years</option>
</select>

<div id="dynamicContent">
</div>

1010 * Javascript *

var computerAge = document.getElementById('computerAge');
var dynamicContent = document.getElementById('dynamicContent');

computerAge.onchange = function()
{
    // Get a list of the current dynamic content
    var contents = document.getElementById('content').document.getElementsByTagname('p');

    // Remove current dynamic content
    for(i = 0; i < contents.length; i++)
    {
        dynamicContent.removeChild(contents[i]);
    }

    // Create new dynamic content
    var dynamicP = document.createElement('p');

    if(computerAge.value == '2 years')
    {
        dynamicP.innerHTML = 'Content for 2 year old computer';
        dynamicContent.appendChild(dynamicP);
    }
    elseif(computerAge.value == '3 years')
    {
        dynamicP.innerHTML = 'Content for 3 year old computer';
        dyanmicContent.appendChild(dynamicP);
    }
}

Или, если вы не создаете элементы динамически:

HTML

<select id="computerAge">
    <option>2_years</option>
    <option>3_years</option>
</select>

<div id="content">
    <div id="2_years" style="display: none">
        <p>Content for 2 year old computer</p>
    </div>  

    <div id="3_years" style="display: none">
        <p>Content for 3 year old computer</p>
    </div>
</div>

Javascript

function init()
{
    // Get the select element
    var select = document.getElementById('computerAge');

    select.onchange = function()
    {
        // Get the elements which could be the dynamic content
        var content = document.getElementById('content')
        var contents = content.getElementsByTagName('div');

        // Iterate over contents; make selected visible and hide others
        for(i = 0; i < contents.length; i++)
        {
            if(contents[i].id == select.value)
            {
                contents[i].style.display = 'block';
            }
            else
            {
                contents[i].style.display = 'none';
            }
        }
    }
}

window.onload = init;

Answer 2

Я думаю, вы смешиваете некоторые вещи. Насколько я понимаю, вы хотите показать или скрыть части страницы в зависимости от того, что пользователь выбрал в раскрывающемся списке.

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

Если вы хотите изменить содержимое без перезагрузки всей страницы, вы должны использовать javascript.
Вы также можете обслуживать новый контент, используя ajax, но я думаю, что вы просто хотите добавить display свойство div к none или что-то в этом роде.