ReSQL.ru
     
powered by simpleCommunicator - 2.0.61     © 2026 Programmizd 02
Мобильная версия    Контакт    Правила    FAQ    Помощь
Целевая тема:
Создать новую тему:
Автор:
Закрыть
Цитировать
Доб. в избранное | Игнор. тему | Прикреп. тему | Пометить прочит. / непрочит. | Фильтр
Форумы / HTML, JavaScript, VBScript, CSS [игнор отключен] [закрыт для гостей] / Slider: как реализовать обработку?
12 сообщений из 12, страница 1 из 1
Slider: как реализовать обработку?
    #38870805
Winnipuh
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Winnipuh
Участник
Есть страница, на ней слайдер, указывающий время от 0-10 сек.
Если число на слайдере >0, то запускается ajax запрос с таким интервалом и по полученным данным рисуется график.
Если выбран 0, то запросы не отсылаются и график не обновляется.

Чего хотелось бы:
Есть у слайдера одна callback функция onchangestate, и когда юзер тянет "бегунок" она вызывается десятки раз в секунду, образно говоря, и стартовать столько раз ajax как-то не красиво.

Как сделать так, чтобы понять, что юзер уже выбрал значение, остановился, и тогда уже перезапускать запросы по таймеру, ну или хотя бы чтобы минимизировать количество пустых запусков?

зы. нашел какой-то слайдер
http://egorkhmelev.github.io/jslider/
...
Рейтинг: 0 / 0
03.02.2015, 21:29
| Ответить | Цитировать | Написать  
Slider: как реализовать обработку?
    #38871035
Фотография -k2-
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
-k2-
Участник
Winnipuh,

возможно
http://benalman.com/projects/jquery-throttle-debounce-plugin/
...
Рейтинг: 0 / 0
04.02.2015, 09:28
| Ответить | Цитировать | Написать  
Slider: как реализовать обработку?
    #38871097
Фотография skyANA
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
skyANA
Участник
Winnipuh,

правильно подсказывают про микропаттерны оптимизации в Javascript: декораторы функций debouncing и throttling .

А для простоты можно обычный setTimeout использовать.
...
Рейтинг: 0 / 0
04.02.2015, 10:22
| Ответить | Цитировать | Написать  
Slider: как реализовать обработку?
    #38871187
Winnipuh
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Winnipuh
Участник
спасибо, коллеги.

По gui:

Покрутил я этот слайдер, виду него приличный, но поведение плохое.
Мне нужен слайдер, чтобы выбирал дискретные значения и чтобы прыгал между ними, а этот хоть и выбирает дискретно, но не прыгает, а постепенно ползет между значениями, что генерирует туеву хучу вызовов колбэка и т.п.

Порекомендуйте приличный слайдер для выбора дискретных значений.
...
Рейтинг: 0 / 0
04.02.2015, 11:53
| Ответить | Цитировать | Написать  
Slider: как реализовать обработку?
    #38871208
Фотография skyANA
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
skyANA
Участник
Winnipuh, что так сложно разобраться в debouncing?

Код: javascript
1.
2.
3.
4.
5.
6.
7.
8.
function debounce(fn, args, context) {
  args = (args !== undefined) ? args : {};

  var t = (typeof(args) === 'object') ? (args.timeout || 500) : args;

  clearTimeout(fn.timeoutId);
  fn.timeoutId = setTimeout(function() { fn.call(context, args); }, t);
}


Ну и пример вызова Вашего onchangestate :
Код: javascript
1.
debounce(onchangestate, 150);
...
Рейтинг: 0 / 0
04.02.2015, 12:06
| Ответить | Цитировать | Написать  
Slider: как реализовать обработку?
    #38871233
Winnipuh
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Winnipuh
Участник
skyANAWinnipuh, что так сложно разобраться в debouncing?

Код: javascript
1.
2.
3.
4.
5.
6.
7.
8.
function debounce(fn, args, context) {
  args = (args !== undefined) ? args : {};

  var t = (typeof(args) === 'object') ? (args.timeout || 500) : args;

  clearTimeout(fn.timeoutId);
  fn.timeoutId = setTimeout(function() { fn.call(context, args); }, t);
}


Ну и пример вызова Вашего onchangestate :
Код: javascript
1.
debounce(onchangestate, 150);



не сложно, разибарюсь, но тяга к прекрасному иногда превалирует, хотя и отдаешь себе отчет в том, что перфекционизм - зло.
...
Рейтинг: 0 / 0
04.02.2015, 12:26
| Ответить | Цитировать | Написать  
Slider: как реализовать обработку?
    #38871290
Фотография -k2-
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
-k2-
Участник
Winnipuh,

может тогда проще в прототип залезть
авторjSlider.prototype.setValue = function(){
var value = this.getValue();
this.inputNode.attr( "value", value );
if(ваше условие, по step или што там есть)
this.onstatechange.call( this, value );
};
...
Рейтинг: 0 / 0
04.02.2015, 12:59
| Ответить | Цитировать | Написать  
Slider: как реализовать обработку?
    #38871294
Фотография -k2-
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
-k2-
Участник
сорри

может тогда проще в прототип залезть
Код: javascript
1.
2.
3.
4.
5.
6.
jSlider.prototype.setValue = function(){
    var value = this.getValue();
    this.inputNode.attr( "value", value );
    if(ваше условие, по step или што там есть)
       this.onstatechange.call( this, value );
  };
...
Рейтинг: 0 / 0
04.02.2015, 13:00
| Ответить | Цитировать | Написать  
Slider: как реализовать обработку?
    #38871330
Winnipuh
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Winnipuh
Участник
-k2-сорри

может тогда проще в прототип залезть
Код: javascript
1.
2.
3.
4.
5.
6.
jSlider.prototype.setValue = function(){
    var value = this.getValue();
    this.inputNode.attr( "value", value );
    if(ваше условие, по step или што там есть)
       this.onstatechange.call( this, value );
  };



Да, можно кстати и так, в этом случае не вызывается колбэк лишние разы, но вот ползунок ставится в любую позицию.

То есть, если юзер потянул и бросил его посреди - сейчас значение показывает ближайшее к дискретному справа или слева, но ползунок устанавливается, куда его до тянули. А хотелось бы, чтобы он прыгал жестко по дискретным значениям, ближайшим к дропнутой позиции.
...
Рейтинг: 0 / 0
04.02.2015, 13:19
| Ответить | Цитировать | Написать  
Slider: как реализовать обработку?
    #38871334
Фотография -k2-
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
-k2-
Участник
Winnipuh,

http://seiyria.github.io/bootstrap-slider/
вот этим я точно пользовалась, change как нужно отрабатывает
Код: javascript
1.
2.
 var mySlider = $("input.slider").slider({step:100});
 mySlider.on("change", function(e){console.log(e.value)});
...
Рейтинг: 0 / 0
04.02.2015, 13:22
| Ответить | Цитировать | Написать  
Slider: как реализовать обработку?
    #38871338
Winnipuh
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Winnipuh
Участник
Вопрос снят, нарыл там параметр не описанный, делает то, что нужно.
Спасибо!
...
Рейтинг: 0 / 0
04.02.2015, 13:23
| Ответить | Цитировать | Написать  
Slider: как реализовать обработку?
    #38871700
Winnipuh
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Winnipuh
Участник
skyANAWinnipuh, что так сложно разобраться в debouncing?

Код: javascript
1.
2.
3.
4.
5.
6.
7.
8.
function debounce(fn, args, context) {
  args = (args !== undefined) ? args : {};

  var t = (typeof(args) === 'object') ? (args.timeout || 500) : args;

  clearTimeout(fn.timeoutId);
  fn.timeoutId = setTimeout(function() { fn.call(context, args); }, t);
}


Ну и пример вызова Вашего onchangestate :
Код: javascript
1.
debounce(onchangestate, 150);



debounce - это то, что надо! спасибо за подсказку.
...
Рейтинг: 0 / 0
04.02.2015, 18:38
| Ответить | Цитировать | Написать  
12 сообщений из 12, страница 1 из 1
Форумы / HTML, JavaScript, VBScript, CSS [игнор отключен] [закрыт для гостей] / Slider: как реализовать обработку?
Найденые пользователи ...
Разблокировать пользователей ...
Читали тему (0):
Читали форум (0):
Пользователи онлайн (0):
Польз. соглашение   Полит. конфиден.  
NoSQL.ru       Кролег: Проекты, Новости, Чат       РЕД ФОРУМ       Фотоальбом: Участники, Встречи
Закрыть
start [/forum/topic.php?fid=22&msg=38871294&tid=1446307]:
 0ms
get settings:
 6ms
get forum list:
 14ms
check forum access:
 2ms
check topic access:
 2ms
track hit:
 152ms
get topic data:
 10ms
get forum data:
 2ms
get page messages:
 63ms
get tp. blocked users:
 1ms
others: 202ms
total:  454ms
созд. / загр.: 454ms
x
x
Закрыть


Просмотр
0 / 0
Close
Debug Console [Select Text]