0

検索フォームのバックボーンビューがあります。フォームには、 jSliderに実装されているスライダーを含むいくつかの要素が含まれています。フォームへのすべての変更をキャプチャし、それに応じて表示される結果を更新したいと思います。

クリックイベントを正常にキャプチャできますが、jSliderでスライドイベントをキャプチャする方法がわかりません-バックボーンでカスタムイベントをバインドする方法は知っていますが、jSliderには直接バインドする方法がないようです。

これが私のHTMLです：

   <form id="searchform">
   <input type="text" id="city" />
   <input type="text" id="type" />
   <input id="price-jslider" type="slider" name="price" value="1;500" />
   </form>

そして、これが私のバックボーンコードです：

var SearchFormView = Backbone.View.extend({
    el: $('#searchForm'),
    events: {
      "click input": "updateResults",
      // how to capture slide event on jslider?
    },
    updateResults: function(e) {
      // do stuff 
    }
   });

この種のイベントをキャプチャする方法について誰かが何かアイデアを持っていますか？

4

2 に答える 2

2

onstatechangejQueryスライダーを初期化するときに関数を渡すことができます。

var SearchFormView = Backbone.View.extend({
    el: $('#searchForm'),
    render: function() {
        var self = this;
        $("#price-jslider").slider({
            onstatechange: function( value ) {
                self.updateResults();
            }
        });
    },
    events: {
      "click input": "updateResults"
    },
    updateResults: function(e) {
      // do stuff 
    }
});
于 2013-01-10T23:15:14.983 に答える
0

jsliderページから

onstatechange function（value）スライダーが状態を変更しているときに関数が起動します。

callback function（value）関数は「mouseup」イベントで起動します。

jsliderをインスタンス化するときは、オプションでそれらの関数を定義します

$(whatever).jslider({
       onstatechange : function(v) {
                 //set your input value to v
                 $('#searchForm').trigger('click')
     }
   })
于 2013-01-10T23:20:08.663 に答える