0

私のプロジェクトには、この興味深い障害があります。

私は現在、タブレットとスマートフォンで動作する MVC3 プロジェクトを行っています。ページ ナビゲーションを備えた HTML5 スライダーが含まれています。コンセプトは、iPad の「The Daily」アプリと非常によく似ています。

http://youtu.be/KHILJBw-104

コンセプトは動画の0:15以降から。

HTML5 スライダーを使用してページを移動したいと考えています。スライドバーをスライドすると、onchangeを使用してhtml5スライダーの値の変化を検出します

@using (Ajax.BeginForm("ViewFilter", new AjaxOptions { UpdateTargetId = "showpage" })){   
    <input name="sliderStatus"  id="sliderStatus" type="range" min="0" max="100" value="0" step="1"  onchange="$(this.form).submit();" />
</div>}

ただし、スライダーの値を変更するたびに、アクション「ViewFilter」がレンダリングされたままになります。

スライドバーをスライドさせて離したときにのみ値が変更されるように対処する方法はありますか?

重要: Jquery スライダーは、Windows 8 の IE10 や iPad の Safari などのタブレット ブラウザーではドラッグできないため、タブレットやスマートフォンでは機能しません。

4

1 に答える 1

1

ユーザーがスライドしてからマウスを離した後にイベントを発生させたい場合は、このようなマウスアップイベントを使用することを検討するか、イベントのタイムアウトを設定するか、時間間隔で onchnge を使用することができますスクロールにかかる時間など、変更後すぐにイベントを発生させないように、システムが待機してイベントを発生させます。

https://developer.mozilla.org/En/Window.setInterval // セット間隔の詳細

$('#sliderStatus').mouseup(function() {
  $(this.form).submit();
});
于 2012-06-27T04:42:11.507 に答える