Getting "this" for the ontouchmove event?

Question

I'm currently trying to create a mobile web application in HTML5, and I was wondering if anyone could point me in the right direction.

I would like to emulate the AZ section index function in iphone / ipad using javascript. Here is an sencha example that you can view on webkit: http://dev.sencha.com/deploy/touch/examples/oreilly/ (click "speakers")

Here is the function that I have so far:

$(".jumplistitem").bind("touchmove", function(e) { e.preventDefault(); letter = $(this).text().toLowerCase(); scrolltarget = ".x-group-" + letter; merchantScroll.scrollToElement(scrolltarget, 0); }); 

The function works normally with a simple click or touch event, but I need this “drag and drop” behavior to be seen in the example. Thus, the user simply drags his finger up and down the list az, and the function works accordingly. Now it works only once.

Interestingly, it works flawlessly with the mouse using the hover event. I just need to imitate this.

I think the problem is with the "this" element, but any help would be appreciated!

Answer 1

The jQuery event object contains a reference to the object that triggered the event. In your example, it will be "e.target".

 letter = e.target.text().toLowerCase();