var slider1 = document.getElementById('disable1'),
    slider2 = document.getElementById('disable2'),
    checkbox1 = document.getElementById('checkbox1'),
    checkbox2 = document.getElementById('checkbox2'),
    checkbox3 = document.getElementById('checkbox3'),
    origins = slider2.querySelectorAll('.noUi-origin');

function toggle(element) {

    // If the checkbox is checked, disabled the slider.
    // Otherwise, re-enable it.
    if (this.checked) {
        element.setAttribute('disabled', true);
    } else {
        element.removeAttribute('disabled');
    }
}

noUiSlider.create(slider1, {
    start: 80,
    connect: [true, false],
    range: {
        min: 0,
        max: 100
    }
});

noUiSlider.create(slider2, {
    start: [20, 80],
    range: {
        min: 0,
        max: 100
    }
});

checkbox1.addEventListener('click', function () {
    toggle.call(this, slider1);
});

checkbox2.addEventListener('click', function () {
    toggle.call(this, origins[0]);
});

checkbox3.addEventListener('click', function () {
    toggle.call(this, origins[1]);
});
