0

touchstart と touchend を使用していくつかの共有オプションを表示するイベントを設定しようとしています。これはネイティブ アプリではかなり標準的な機能ですが、モバイル Web ではあまり見たことがありません。このイベントにより、ユーザーはサイトのメイン コンテンツ エリアをタップできます。タップが 1 秒を超えると、オプション ボックスが画面上でスライドし、ページ コンテンツを共有するためのオプションが表示されます。

以下の関数は最初のイベントに対して機能しますが、ユーザーがイベントを複数回トリガーすると、イベントを発生させるための 1 秒の要件がなくても発生します。

誰かがより良いアプローチを提案したり、タイマーが毎回機能しない理由を確認したりできますか?

if ( typeof ontouchstart != 'undefined' && typeof ontouchend != 'undefined' ) { 
var touchStartOrClick = 'touchstart', touchEndOrClick = 'touchend'; 
} else {
var touchStartOrClick = 'click', touchEndOrClick = 'click'; 
};

function shareTog(){
    $('.sharing-pop').animate({width: 'toggle'});
}

var touchTrigger;

$('#content').bind(touchStartOrClick, function(){
    setInterval(function(){
        touchTrigger = true;
    }, 1000);
}).bind(touchEndOrClick, function(){
    window.clearInterval();
    if(touchTrigger == true){
        shareTog();
        touchTrigger = false;
    }
});

jQuery Mobile を使用すると、これがはるかに簡単になることは承知していますが、残念ながらそれはオプションではありません。

4

2 に答える 2

1

ゼプトはあなたにとって良い選択です。そのタッチ モジュールは優れたイベント ハンドラーを提供します。

または、 zepto touchのソース コードを確認できます。

于 2012-09-06T09:12:42.753 に答える
0

私はあなたのドリフトをキャッチしますが、それが Web ブラウザーでの良い解決策だとは思いません。たとえば Android では、Web ページのコンテンツを長押しすると、すでにポップアップが表示されます。そのイベント ハンドラーをブロックする必要がありますが、それはネイティブになることを意味します。

于 2012-09-04T17:03:27.303 に答える