<input type="range"/>需求:滑动时,计数$.fn.RangeSlider = function(cfg) { this.sliderCfg = { min: cfg && !isNaN(parseFloat(cfg.min)) ? Number(cfg.min) : null, max: cfg && !isNaN(parseFloat(cfg.max)) ? Number(cfg.max) : null, step: cfg && Number(cfg.step) ? cfg.step : 1, callback: cfg && cfg.callback ? cfg.callback : null }
var $input = $(this) var min = this.sliderCfg.min var max = this.sliderCfg.max var step = this.sliderCfg.step var callback = this.sliderCfg.callback $input.attr(‘min‘, min) .attr(‘max‘, max) .attr(‘step‘, step) $input.bind(‘input‘, function(e) { $input.attr(‘value‘, this.value) $input.css(‘background-size‘, this.value + ‘% 100%‘) if ($.isFunction(callback)) { callback(this) } })}var change = function($input) { var Value = $(‘input‘).attr(‘value‘) * 5 var Price = Value + 200 var Price1 = Value + 150 var Price2 = Value + 100 $(‘.proportion‘).text(Value + ‘%‘) $(‘.profit‘).text(‘¥‘ + Value) $(‘.price‘).text(‘¥‘ + Price) $(‘.price1‘).text(‘¥‘ + Price1) $(‘.price2‘).text(‘¥‘ + Price2)}$(‘input‘).RangeSlider({ min: 0, max: 100, step: 1, callback: change })
时间: 2024-11-05 17:30:09