【发布时间】:2017-04-24 21:24:42
【问题描述】:
问候 stackoverflow - 我正在使用 jQuery .click,它不会在触摸屏设备上触发。我已经使用 .touchstart 让 click 事件工作,但这并不理想,因为它也会在用户点击屏幕开始滚动时触发。
我缺少什么会阻止 .click 或 .touch 在触摸屏设备上工作吗?
基本小提琴here.
HTML:
<form class="form-horizontal">
<div class="container-fluid constraint">
<h3>Style</h3>
<div class="control-group">
<label class="checkbox">
<input type="checkbox" data-facet="28" data-constraint="2" data-cat="205" value="1">
<span>Anti-slip</span>
</label>
<label class="checkbox">
<input type="checkbox" data-facet="5" data-constraint="2" data-cat="205" value="1">
<span>Cement/Concrete</span>
</label>
<label class="checkbox">
<input type="checkbox" data-facet="18" data-constraint="2" data-cat="205" value="1">
<span>Contemporary</span>
</label>
<label class="checkbox">
<input type="checkbox" data-facet="23" data-constraint="2" data-cat="205" value="1">
<span>Encaustic</span>
</label>
<label class="checkbox">
<input type="checkbox" data-facet="17" data-constraint="2" data-cat="205" value="1">
<span>Hexagon</span>
</label>
<label class="checkbox">
<input type="checkbox" data-facet="24" data-constraint="2" data-cat="205" value="1">
<span>Large Format</span>
</label>
<label class="checkbox">
<input type="checkbox" data-facet="48" data-constraint="2" data-cat="205" value="1">
<span>Marble</span>
</label>
<label class="checkbox">
<input type="checkbox" data-facet="29" data-constraint="2" data-cat="205" value="1">
<span>Mosaic</span>
</label>
<label class="checkbox">
<input type="checkbox" data-facet="26" data-constraint="2" data-cat="205" value="1">
<span>Outdoor</span>
</label>
<label class="checkbox">
<input type="checkbox" data-facet="25" data-constraint="2" data-cat="205" value="1">
<span>Slim Porcelain</span>
</label>
<label class="checkbox">
<input type="checkbox" data-facet="4" data-constraint="2" data-cat="205" value="1">
<span>Stone</span>
</label>
<label class="checkbox">
<input type="checkbox" data-facet="22" data-constraint="2" data-cat="205" value="1">
<span>Traditional</span>
</label>
<label class="checkbox">
<input type="checkbox" data-facet="54" data-constraint="2" data-cat="205" value="1">
<span>Wood</span>
</label>
</div>
</div>
</form>
CSS:
.constraint {
margin-bottom: 20px;
}
.constraint h3 {
font-size: 24px;
font-weight: bold;
margin-bottom: 10px;
}
.constraint .control-group {
display: none;
}
jQuery:
$(document).on('click touch', '.constraint h3', function() {
$(this).next('.control-group').slideToggle(500);
});
提前感谢您的帮助!
【问题讨论】:
-
.click()绝对可以在移动设备上运行。 Here 是触摸时触发的事件的有序列表。 -
感谢@BramVanroy,但添加
cursor: pointer;(如可能重复中所述)已解决问题。看起来像一个 iOS 错误。
标签: jquery