Bootstrap-slider加载不起作用

Question

我认为我遇到的问题是能够选择属于bootstrap-slider的DOM元素。当我尝试使用诸如click之类的事件来定位它们时，什么都不会被触发。

刷新页面时，所有事件都会正常启动。为什么会发生这种情况？

$(document).on("page:change", function() {
    $(".slider-handle")
        .on("mousedown", function() {
            console.log("FOCUSED")
            $(".active-handle").removeClass("active-handle");
            $(this).addClass("active-handle");
        })
        .on("mouseup", function() {
            console.log("REMOVED")
            $(this).removeClass("active-handle");
            $(".active-handle").removeClass("active-handle");
        })
        .on("click", function() {
            console.log("REMOVED")
            $(this).removeClass("active-handle");
            $(".active-handle").removeClass("active-handle");
        })

Answer 1

如果元素在加载时不可见，则jQuery无法分配事件处理程序。试试这个：

$(document).on("mousedown", ".slider-handle", function() {

要提高性能，请将document替换为任何持久性祖先元素。