Question

我对javascript和jquery完全不熟悉。我的编程知识是......不存在的，我几天前刚刚开始执行一些简单的任务，比如替换css类或切换div。所以我想道歉，如果我在这里问新手问题我正在踩着某人的脚趾。但我希望有人可以帮助我并解决我的问题。

我需要为调查实施某种视觉模拟量表; ui.slider非常适合那个。但是我需要默认隐藏句柄。当用户点击滑块时，手柄应出现在正确的位置。这应该是相当简单的 - 至少我希望如此 - 只需用css隐藏句柄并通过滑块上的click事件更改它。

我使用下面的代码来包装一个普通的div（在我的理解中需要div来应用jquery slider.js）到我的输入元素（它们应该 - 至少在视觉上 - 用滑块代替）和将滑块的值传递给输入元素（将值传递给表单所需）。这工作正常。（我这样做而不是仅仅在我的DOM中放置一个div，因为我无法影响一些将生成调查的表单元素的php脚本等等）

$(function() {
$.each($('.slider'),
function() {
    obj = $(this);
    obj.wrap('<div></div>');
    obj.parent().slider({
        change: function(event, ui) {
            $('input', this).val(ui.value);
        }
    });
});
});

如上所述，通过更改a.ui-slider-handle的样式属性，可以通过CSS隐藏滑块手柄。但是当我向滑块(.ui-slider)添加一个正常的点击事件来改变句柄的css属性时，没有任何反应。就我的基本知识而言，它应该与不处理生成的DOM元素的click事件有关。我是对的吗？如果是的话：我该如何解决这个问题呢？有人可以为我的功能提供一段代码并解释它，以便我可以理解究竟发生了什么？

我在Learningjquery.com上阅读了关于事件的教程，但是自从我开始使用JS / jquery来理解这些步骤并将其转换为我的示例/问题以来，我在最近几天没有取得足够的进展。而且我的时间已经不多了（我需要这个调查，我必须尽快做出调查，这就是为什么我希望有人可以给我一个提示，以便我能以某种方式解决这个小问题。）

非常感谢，马克。

Answer 1

您是否有任何理由不能在变更事件中包含该节目而不是点击？它代码更清晰，而不是包含一个全新的事件。

$(function() {
  $('.slider').wrap('<div></div>').parent().slider({
    change: function(event, ui) {
      $('input', this).val(ui.value);
      $('.ui-slider-handle').show();
    }
  });
});

此外，代码中存在一些冗余 - 大多数jQuery函数返回对象本身，因此您可以链接它们。并且你不需要每个函数，因为大多数jQuery函数在应用于集合时也可以在所有函数上运行：）

jquery ui.slider：添加click事件以显示/隐藏句柄

1 个答案: