Сделайте так, чтобы элемент клика работал внутри сортируемого элемента на Android - PullRequest
Новая
       44

Сделайте так, чтобы элемент клика работал внутри сортируемого элемента на Android

0 голосов
/ 14 февраля 2019

У меня есть серия сортируемых элементов, каждый из которых содержит меньший кликабельный элемент.Я могу просто нажимать на эти элементы на десктопе и iOS, но на Android щелчок работает только примерно 1 из 10 раз.Вместо этого щелчок активирует перетаскиваемого родителя.

Я использую 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>
...