【问题标题】:Jquery UI slider events not working Drupal 7Jquery UI滑块事件不起作用Drupal 7
【发布时间】:2014-08-07 10:58:45
【问题描述】:

我正在尝试为视图表单实现一个滑块(我已经隐藏了文本字段并希望制作一个脚本来显示滑块并在更改/停止时将值设置为隐藏的文本字段。我的问题是事件根本没有触发。我在模板的 template.php 中添加了 jquery UI 库和脚本(使用 ZEN):

function ThemeName_preprocess_page(&$variables) {
  drupal_add_library('system', 'ui');
  drupal_add_library('system', 'ui.slider');
  drupal_add_js('URL/js/search.js');
}

这是 javascript/jquery 代码:

(function ($, Drupal, window, document, undefined) {
  Drupal.behaviors.customSearch = {
    attach: function(context, settings) {
        $(document).ready(function (){
          $("#distanta_slider").slider({
                orientation: "horizontal",
                range: "min",
                max: 150,
                min: 1,
                value: 1,
                //change: slider_change(),
                //slide: slider_change(),
                //stop: slider_change()
            });
            $("#distanta_slider").on("slidestop",slider_change());
            $("#distanta_slider").on("slide",slider_change());
            $("#distanta_slider").on("slidechange",slider_change());
            });
        function slider_change(){
            alert($("#distanta_slider").slider("value"));
        }
      }
  };
})(jQuery, Drupal, this, this.document);

我尝试使用 $(selector).on 绑定事件,还尝试在构造函数中声明它们(3 条注释行)。在页面加载的第一个场景中,我收到了 3 个带有当前值的警报,在第二个场景中,我收到了 3 个警报,说“对象对象”,但是在这两个场景中,如果我移动滑块,绝对不会发生任何事情......没有错误,什么都没有。

非常感谢任何帮助。提前谢谢你,

克里斯蒂

【问题讨论】:

    标签: javascript php jquery drupal drupal-7


    【解决方案1】:

    在 on 语句中调用不带参数的函数名。

     $("#distanta_slider").on("slidestop",slider_change);
     $("#distanta_slider").on("slide",slider_change);
     $("#distanta_slider").on("slidechange",slider_change);
    

    错误的假设

    $("#distanta_slider").on("slidestop",slider_change());
    

    slider_change 函数在此处立即执行

    【讨论】:

    • 难以置信...就这么简单....我是个白痴。非常感谢您的帮助。
    • 很高兴帮助你克里斯蒂
    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 2023-03-16
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2018-08-07
    • 1970-01-01
    相关资源
    最近更新 更多