javascript - Jquery UI slider 事件不起作用 Drupal 7

标签 javascript php jquery drupal drupal-7

我正在尝试为 View 表单实现一个 slider (我隐藏了文本字段,并希望编写一个脚本来显示 slider ,并在更改/停止时将值设置为隐藏文本字段。我的问题是事件根本没有触发。我在模板的 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 绑定(bind)事件,并尝试在构造函数中声明它们(3 条注释行)。在页面加载的第一个场景中,我收到了 3 个带有当前值的警报,在第二个场景中,我收到了 3 个表示“对象对象”的警报,但在这两种情况下,如果我移动 slider ,绝对不会发生任何事情......没有错误,没有任何事情。

非常感谢任何帮助。预先感谢您,

克里斯蒂

最佳答案

在 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 在此处立即执行

关于javascript - Jquery UI slider 事件不起作用 Drupal 7,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/25180768/

相关文章:

php - 是什么导致错误 'Not Found SoftDeletingTrait Class' ?

php - 如何在smarty中打印数组?

jquery - 当应用于 $(document) 时,数据属性的值放在哪里?

javascript - onsubmit 验证所有函数返回真

javascript - D3桑基图中节点的垂直排序

javascript - 重复菜单上的 fullpage.js 事件状态

jquery - 如果 <p> 标签返回空,移除父 div

javascript - 显示 json 返回未定义

javascript - 数量价格折扣 html/java/php

javascript - knockout : Unusual Mapping Pattern