input type=range iOS手机上无法点击,但可以拖拽

做了一个进度条,在安卓手机上可以点击和拖拽,但是在iOS手机上只能拖拽,不能点击,请教大神这个是怎么一回事? 急!急!急!### 问题描述

链接地址:

http://wxqas.yayaim.com:8666/yunzhongku/test/photon/photon-v1.1.0/basic.html?token=18219160086268450&appId=100099&networkStatus=2&phone=18219160086&limitTime=1535099558&soureIp=42.94.11.24:3276&channelId=00

相关代码

    //HTML结构
    <input type="range" value="0">

<script>

    
    //定义方法
    $.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,
            val: cfg && Number(cfg.val) ? cfg.val : 0,
            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 val = this.sliderCfg.val;
        var callback = this.sliderCfg.callback;

        $input.attr('min', min)
            .attr('max', max)
            .attr('step', step)
            .attr('value', val);
        $input.css('background-image', 'linear-gradient(to right, #fb974a 0%, #f76026 ' + (step/max)*100*val + '%, transparent ' + (step/max)*100*val + '%)' );
        // $input.css('background', 'linear-gradient(to right, #059CFA, white ' + (step/max)*100*val + '%, white)');

        $input.bind("input", function (e) {
            // console.log(this.value);
            $input.attr('value', this.value);
            $input.css('background-image', 'linear-gradient(to right, #fb974a 0%, #f76026 ' + (step/max)*100*this.value + '%, transparent ' + (step/max)*100*this.value + '%)');
            if ($.isFunction(callback)) {
                callback(this);
            }
        });
    };
</script>

<script>
    //调用方法
    var change = function ($input) {
        /*内容可自行定义*/
        console.log($($input).val());
    }

    $('input').RangeSlider({
        min: 0,  //最小范围
        max: 2,  //最大范围
        step: 1,  //一次移动步数
        val: 1,  //用户自定义位置
        callback: change   //回调函数
    });
</script>

你期待的结果是什么?实际看到的错误信息又是什么?

希望iOS跟安卓一样,也可以点击

阅读 3.3k
1 个回答

ios不支持range属性

撰写回答
你尚未登录,登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进,让解决方法与时俱进
推荐问题