首页 > 解决方案 > 选中复选框时如何更新滑块最大值

问题描述

我整个上午都在做这个。我在这里查看了各种答案,但似乎无法让它们中的任何一个起作用。

这是我的 HTML:

<input type="checkbox" class="form-check-input" name="200" id="200Box" value="1" onClick="open200()">

 <input id="destinationSpecialistSlider" name="destinationSpecialistSlider" class="no-border w-75" type="range" value="0" min="0" max="1500" step="100" style="height: 0.5em" oninput="destinationSpecialistSlider_disp.value = destinationSpecialistSlider.value">
           <div>
           <p>$<output  id="destinationSpecialistSlider_disp" class="m-0" style="height: 1.5em">0</output></p></b>
           </div>

还有我的 jQuery:

function open200(){

  if($(document.getElementById('200Box')).is(":checked"))  

                alert("yes"),

                    $("#destinationSpecialistSlider").slider('option',{min: 0, max: 7500});

                else

                alert("no");}   

警报正在工作,但我似乎无法更改滑块上的最大选项。

我敢肯定这是一件愚蠢的事情,但我已经盯着它看了很长时间,以至于我似乎看不到它。

帮助?

标签: jquery

解决方案


试试这个:重要 - 删除 onClick 事件。

$(document).ready(function() {

    $('#200Box').change(function() {
        if(this.checked) {
           $("#destinationSpecialistSlider").attr('max', 7500).val(0);

        }else
        {
           $("#destinationSpecialistSlider").attr('max', 1500).val(0);
        }

    });
});

推荐阅读