2

jQuery Mobile アプリで、タップ イベントとタップ ホールド イベントを使用したいと考えています。イベントハンドラーをこれらのイベントにバインドする標準的なアプローチを使用してみましたが、タップホールドイベントの場合、タップイベントは常に発生していたので、スタックオーバーフローで見つけた次のアプローチを使用しました: タップホールドイベント後にクリックイベントを呼び出すjQuery

$("#list li").live('vmousedown vmouseup', function (event) 
{
    if (event.type == 'vmousedown')
{
        tapTime = new Date().getTime();
    } 
    else 
    {
        //event.type == 'vmouseup'
        //here you can check how long the `tap` was to determine what do do
        duration = (new Date().getTime() - tapTime);

        //The tap code
        if(duration >250 && duration <750)
        {

        }
        //The taphold code

        else if (duration >=750) {

 }

現在、iOS 5 を搭載した iPhone で、タップ イベントが発生し、リストを下にスクロールすると項目が選択されるという問題が発生しています。タップイベントの継続時間を長くしようとしましたが、iOS では効果がないようです。助言がありますか？

4

1 に答える 1

1

【試行錯誤】 jQuery Mobileの実装を確認してみました。彼らは、「vmouseup」で毎回「taphold」の後に「tap」イベントを発生させています。

回避策は、「taphold」が発生した場合、「tap」イベントを発生させないことです。次のように、カスタム イベントを作成するか、必要に応じてソースを変更します。

$.event.special.tap = {
    tapholdThreshold: 750,

    setup: function() {
        var thisObject = this,
            $this = $( thisObject );

        $this.bind( "vmousedown", function( event ) {

            if ( event.which && event.which !== 1 ) {
                return false;
            }

            var origTarget = event.target,
                origEvent = event.originalEvent,
                /****************Modified Here**************************/
                tapfired = false,
                timer;

            function clearTapTimer() {
                clearTimeout( timer );
            }

            function clearTapHandlers() {
                clearTapTimer();

                $this.unbind( "vclick", clickHandler )
                    .unbind( "vmouseup", clearTapTimer );
                $( document ).unbind( "vmousecancel", clearTapHandlers );
            }

            function clickHandler( event ) {
                clearTapHandlers();

                // ONLY trigger a 'tap' event if the start target is
                // the same as the stop target.
                /****************Modified Here**************************/
                //if ( origTarget === event.target) {
                 if ( origTarget === event.target && !tapfired) {
                     triggerCustomEvent( thisObject, "tap", event );
                 }
            }

            $this.bind( "vmouseup", clearTapTimer )
                .bind( "vclick", clickHandler );
            $( document ).bind( "vmousecancel", clearTapHandlers );

            timer = setTimeout( function() {
                tapfired = true;/****************Modified Here**************************/
                triggerCustomEvent( thisObject, "taphold", $.Event( "taphold", { target: origTarget } ) );
            }, $.event.special.tap.tapholdThreshold );
        });
    }
};
于 2012-08-13T20:10:07.773 に答える