Как мне скользить / открывать определенный пункт меню, используя javascript / jquery при загрузке страницы?

Question

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

Я использую это:

<!-- menu -->
<div id="menuone">
    <ul id="menu">
        <li>
            <a href="#">Home</a>
        </li>
        <li>
            <a>About</a>
            <ul>
                <li><a href="#">one</a></li>
                <li><a href="#">two</a></li>
                <li><a href="#">three</a></li>
            </ul>
        </li>
        <li>
            <a>Projects</a>
            <ul>
                <li><a href="#">project1</a></li>
                <li><a href="#">project2</a></li>
                <li><a href="#">project3</a></li>
            </ul>
        </li>
    </ul>
</div>
<!-- menu end -->

и мой javascript на клике такой:

function initMenu() {
  $('#menu ul').hide();
  $('#menu li a').click(
    function() {
         $(this).next().slideToggle('normal');               
      }
    );
  } 
 $(document).ready(function() {initMenu();});

но мой квест: как открыть определенный элемент (ы) при загрузке страницы? Как мне открыть пункт меню 2 (например, "about") или пункт меню 3 ("projects") и т. Д ...?

Answer 1

довольно легко на самом деле;

$('#menu li a:eq(1)').trigger('click'); //open "about"
$('#menu li a:eq(2)').trigger('click'); //open "projects"

надеюсь, я помог

Answer 2

Поместите идентификатор в ваши a теги, такие как

<div id="menuone">
<ul id="menu">
    <li>
        <a href="#" id="home">Home</a>
    </li>
    <li>
        <a id="about">About</a>
        <ul>
            <li><a href="#">one</a></li>
            <li><a href="#">two</a></li>
            <li><a href="#">three</a></li>
        </ul>
    </li>
    <li>
        <a id="projects">Projects</a>
        <ul>
            <li><a href="#">project1</a></li>
            <li><a href="#">project2</a></li>
            <li><a href="#">project3</a></li>
        </ul>
    </li>
</ul>
</div>

, а затем передать выбранный вами идентификатор вашей функции, например

// Pay attention to pass id to function
function initMenu(id)
{
    $('#menu ul').hide();
    $('#menu li a').click(
    function() {
        $(this).next().slideToggle('normal');               
    });

    // Add following lines
    if (typeof(id) != 'undefined')
    {
        $('#'+id).click();
    }
} 

$(document).ready(function() {initMenu('projects');});

Затем для изменения вы можете использовать вместо

$(document).ready(function() {initMenu('about');});