Question

我有一系列可排序的元素，每个元素都包含一个较小的clickable元素。我可以在台式机和iOS上单击这些元素，但是在Android上，单击仅能进行十分之一的操作。点击会激活可拖动的父代。

我正在使用jquery Sortable，然后触摸打孔使Sortable在移动设备上工作。

如何在Android上执行此操作？

我尝试了后来有人提出的触摸打孔（0.4.0），但这没什么区别。

CSS

<style>
.draggable_item{
        width:50px;
        display:inline-block;
}
.colored_box{
        height:50px;
        width:50px;
        display:inline-block;
}
.click_button{
        height:70px;
        line-height:70px;
        background:pink;
}
</style>

HTML

<div id = "sortable">
    <div class= "draggable_item" >
        <div class="colored_box" style="background:green">
        </div>
        <div class="click_button">
           click!
        </div>
    </div>
      <div class= "draggable_item">
          <div class="colored_box" style="background:red">
            </div>
            <div class="click_button">
           click!
        </div>
    </div>
</div>

JS

<script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.12.1/jquery-ui.min.js"></script>
<script src="https://raw.githubusercontent.com/furf/jquery-ui-touch-punch/master/jquery.ui.touch-punch.min.js"></script>

<script>
$( "#sortable" ).sortable({
  items: '.draggable_item',
});

$("body").on("click", ".click_button", function(event) { 
    alert("clicked");
})
</script>

使Click元素在Android上的Sortable元素内工作

0 个答案: