Javascript onClick移动设备 [英] Javascript onClick for mobile devices

问题描述

我正在研究导航的子菜单，我需要使用移动设备和平板电脑设备。我知道，使用onClick =返回true将做到这一点，但是，当用户单击列表项时，我还需要我的列表项关闭。基本上我需要它来切换子菜单。如果我添加这个简单的Javascript代码，它将起作用，但子菜单将始终保持打开状态。

I am working on a submenu for a nav that I need to be accessible for mobile and tablet devices. I am aware that using onClick="return true" will do the trick, however, I also need my list item to close when the user clicks on the list item. Basically I need it to toggle the submenu. If I add this simple line of Javascript, it will work but the submenu will always remain open. How can I get it to close/toggle the submenu?

HTML:
        <nav>
            <ul>
                <li class="active"><a href="#">Menu 1</a></li>
                <li><a href="#">Menu 2</a></li>
                <li><a href="#">Menu 3</a></li>
                <li class="bg"><a class="dropdown" href="#">Menu 4</a>
                    <ul>
                        <li><a href="#">Sub 1</a></li>
                        <li><a href="#">Sub 2</a></li>
                    </ul>
                </li>
            </ul>
        </nav>

Javascript:
$('nav li.bg').on('click', function(){
  return true;
}

推荐答案

您可以使用 touchstart 在手机浏览器上触发的事件。

You can use touchstart event which fires on mobile browsers.

$('nav li.bg').on('click touchstart', function(){
    return true;
});

更多基于触摸的事件

这篇关于Javascript onClick移动设备的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！