モバイルデバイスで、具体的に選択したいdiv w.r.t. touchすなわち。ユーザーがfirst divとtouchmove〜3rd divをタッチすると、両方のdivを選択する必要があります。万力のような順序は、添付された画像がより良い理解をモバイルデバイスでjQueryタッチセレクトdivをランダムに選択
1 3 2選択
1 2 3選択
を与える1 2 3 4、1 3 2 4をランダムとすることができます
また、同じものに対してjsfiddleを作成しました私はこれまでにしました。それはjsfiddleで確認できます。私はjqueryモバイルを使用して、touchとtouchmoveイベントを使用しようとしていますが、それは私の要件に従って動作していません。
、この中で感謝何をしたい
そのない（私にとっては）本当に明確な私を助けてください。 あなたの自己をあなたの問題を解決するのに役立つかもしれないあなたのための本当に簡単な試みはここにあります。
チェックアウトこのスニペット
EDIT：更新、今も働く（v）のごjsfiddleも更新
$(function() {
$(".section").on('vclick', function(e) {
$('.logs').html('eventType: ' + e.originalEvent.type);
$(this).addClass('green');
toHighlightElements($(this), $(".section"));
})
$(".sections-wrapper").on('vmousemove', function(e) {
$('.logs').html('eventType: ' + e.originalEvent.type);
var $target;
if(e.originalEvent.type === 'touchmove') {
e.preventDefault();
$target = getActiveElement($(".section"), e.clientX, e.clientY);
if(typeof $target === 'undefined') {
return;
}
}
else {
$target = $(e.target);
}
toHighlightElements($target, $(".section"));
});
function toHighlightElements($current, $overall) {
for (var i = 0 ; i <= $current.index() ; i++) {
$overall.eq(i).addClass('green');
}
}
function getActiveElement($overallElements, x, y) {
return $(document.elementFromPoint(x, y));
}
$('.reset').click(function() {
$(".section").removeClass('green');
});
});.section {
width: 50px;
height: 50px;
border: 1px solid black;
background-color: grey;
}
.green {
background-color: green !important;
}
.allowLeft {
float: left;
}
.sections-wrapper {
background: red;
width: 105px;
}<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://code.jquery.com/ui/1.11.4/jquery-ui.js">
</script>
<script src="https://code.jquery.com/mobile/1.4.5/jquery.mobile-1.4.5.js"></script>
<div class="sections-wrapper">
<div class="section allowLeft">
1
</div>
<div class="section allowLeft">
2
</div>
<div class="section allowLeft">
3
</div>
<div class="section allowLeft">
4
</div>
<br style="clear: both" />
</div>
<br><br>
<button class="reset">
reset
</button>
<div class="logs">
</div>touchmove：https://jsfiddle.net/m03g52ah/12/
なぜあなたは私たちをいけないjQuery-Mobileを使用している場合は 'vclick/vmousemove'ですか？これは両方のイベントタイプ（デスクトップ/モバイル）を処理します。 'originalEvent'でチェックできる現在のタイプです。あなたのフィドルを見てください：https://jsfiddle.net/m03g52ah/7/ – pleinx
ありがとうございます - しかし実際には各部門にタップする必要があります。実際に1st 2ndと3rdをハイライトする必要があります。 – mujaffars
はい、確かに、問題の完全な解決策ではありませんでしたが、どのようにそれを解決することができます。 :-)あなたの ''を数え、現在の ''が選択（タッチ）されているかどうかを確認します。今現在のターゲットの '.index（）'と ''の数を比較できます。ここでは、どの要素を強調表示して強調表示しているのかをチェックする小さなロジックを構築します。 –
pleinx