Can you please help me to locate on which element “taphold” is fired by using JS, jQuery, or jQuery Mobile?
My HTML structure is like the below
<script> $(document).on("pagecreate", function () { $("#myFilesListView").bind('contextmenu', function (event) { event.preventDefault(); event.stopPropagation(); return false; }); }); $(document).ready(function () { $("#myFilesListView").bind("taphold", function (event) { event.preventDefault(false); event.stopPropagation(); var ID = $(this).child().attr("id"); alert(ID); }); }); </script>
<div data-role="page" id="page1"> <div data-role="header"></div> <div data-role="main"> <ul data-role="listview" id="mylistview"> <li class="mydata" id="1"> some conetent</li> <li class="mydata" id="2"> some conetent</li> <li class="mydata" id="3"> some conetent</li> <li class="mydata" id="4"> some conetent</li> <li class="mydata" id="5"> some conetent</li> <!--ids are not in predefined sequences and there may be 100s of list--> </ul> </div> <div data-role="fotter"></div> </div>
In my JavaScript code I am able to prevent the default behavior of taphold, but I am not getting how to get the Id of a particular list as soon as a user tap and hold on that list.
Advertisement
Answer
You can bind the taphold to the li elements instead of the listview:
$(document).on("pagecreate", "#page1", function () { $("#mylistview").on('contextmenu', function (event) { event.preventDefault(); event.stopPropagation(); return false; }); $("#mylistview li").on("taphold", function (event) { var ID = $(this).prop("id"); alert(ID); }); });