Question

我已经实现了一些适用于桌面的代码，但在移动设备中，它无法按预期工作。在移动设备中，当您单击div时，应切换以打开内容。但是，它会打开它，然后自动再次关闭它，这样用户就无法看到内容。以下是我到目前为止的情况：

$(document).on('click touchstart', '.contact_Style h2.general_Click', function() {
    $(this).next().toggle('slow');
});

<h2 class="general_Click">Search </h2>
<div id="search">The Content</div>

任何帮助都将不胜感激。

Answer 1

只需绑定到click，因为移动浏览器会触摸它，因此您可以获得2个回调调用（打开然后关闭内容）。

您可以阅读此行为here

Answer 2

我在你的代码中进行了一些小修正。首先，您需要默认隐藏内容div。在样式文件中添加：

#search{display: none}

然后尝试使用此js代码

<script type="text/javascript">
    $(document).on('click', 'h2.general_Click', function() {
        $(this).next().toggle('slow');
    }); 
</script>

你的html会是这样的：

<h2 class="general_Click">Search </h2>

<div id="search">The Content</div>

Answer 3

在我的情况下，选择器“h2.general_Click”创建了2次（请检入您的视图源），这就是它调用2次并自动关闭的原因

请检查您的选择器不重复的视图源代码。如果它正在重复，那么选择一个在您的网页中不重复的扇区。

Jquery在移动设备中自动打开和关闭

3 个答案: