Измените класс с помощью Javascript, установите класс элемента по умолчанию по умолчанию

Во-первых, я понимаю, что мой вопрос может быть относительно похож на некоторые другие сообщения, однако я попытался реализовать код из других сообщений, но просто не мог заставить его работать Я хотел. Я довольно новичок в Javascript, поэтому, пожалуйста, несите меня.Измените класс с помощью Javascript, установите класс элемента по умолчанию по умолчанию

У меня есть выбор ссылок в отдельных элементах div, которые выглядят как вкладки. Каждый раз, когда я нажимаю на другую ссылку, цвет фона меняется с серого на белый для активного, а цвет фона ранее активных ссылок меняется от белого до серого.

Вот моя загадка: мне нужна настройка по умолчанию для ссылки «Главная», чтобы она имела белый фон при загрузке страницы.

Вот код:

div.none { 
    background-color: #cccccc; 
    border-radius: 10px 10px 0px 0px; 
    float: right; 
    padding: 5px 15px 3px 15px; 
    } 

    div.active { 
    background-color: white; 
    border-radius: 10px 10px 0px 0px; 
    float: right; 
    padding: 5px 15px 3px 15px; 
    } 

    ... 

    <script type="text/javascript"> 

    var selected = null; 

    function toggleClass(x) { 
     if (selected != null) 
      selected.className = 'none'; 

     selected = x; 
     x.className = 'active'; 
    } 

    </script> 

    ... 

    <div class="none" id="t1"><a class="menu" href="#1.html" onclick="toggleClass(t1)" target="tabs">Book Online</a></div> 
    <div class="none" id="t2"><a class="menu" href="#2.html" onclick="toggleClass(t2)" target="tabs"> Contact</a></div> 
    <div class="none" id="t3"><a class="menu" href="#3" onclick="toggleClass(t3)" target="tabs">News</a></div> 
    <div class="none" id="t4"><a class="menu" href="#4" onclick="toggleClass(t4)" target="tabs"> Mobile Recording</a></div> 
    <div class="none" id="t5"><a class="menu" href="#5" onclick="toggleClass(t5)" target="tabs"> Recording Studios</a></div> 
    <div class="none" id="t6"><a class="menu" href="#6" onload="toggleClass(t6)" onclick="toggleClass(t6)" target="tabs">Home</a></div>

Спасибо заранее, если вы можете помочь!

источник

2012-05-29 patwick600akabob

Это только я, или вы забыли задать свой вопрос в конце ...? – gdoron

Вот моя головоломка: мне нужна настройка по умолчанию для ссылки «Главная», поэтому она имеет белый фон при загрузке страницы. Это мой вопрос. – patwick600akabob

Изменить начальный класс на 'active' для домашней ссылки ...?

источник

2012-05-29 17:18:18 Mathletics

Когда я устанавливаю активную ссылку «Домой», она постоянно отображает цвет фона. – patwick600akabob

start 'selected' как ваша домашняя вкладка вместо нуля. Для записи это выглядит как ужасный способ делать вкладки. У вас не должно быть JS в вашем HTML, и вам не нужно управлять состоянием в JS, особенно если вы маркируете классы. – Mathletics

как бы это реализовать? – patwick600akabob

Добавьте класс активного в DIV, который имеет ссылку для дома (во время разработки)

<div class="none active" id="t6"><a class="menu" href="#6" onload="toggleClass(t6)" onclick="toggleClass(t6)" target="tabs">Home</a></div>

Тем не менее, вам все равно придется писать логику в вашем JavaScript, чтобы удалить этот класс, когда некоторые другие вкладки и добавьте класс active к выбранной вкладке.

источник

2012-05-29 17:27:00 Wiz

Я только что понял, что оставил onload в своем коде, я думал, что он изменит класс на активный, когда страница будет загружена. Есть ли способ реализовать это? Я просто попробовал, что вы сказали, но он просто сохраняет цвет фона Home link белым навсегда. – patwick600akabob

Измените класс с помощью Javascript, установите класс элемента по умолчанию по умолчанию

ответ

Смежные вопросы