Javascript 将事件处理程序添加到jquery slider的coffeescript类

我是coffeescript新手，希望在一个客户端视图上使用多个jquery滑块。我想将幻灯片事件用于几个功能。滑块显示，值显示在开始处，滑块可用，但不使用事件

class Slider  
 constructor: (@min, @max, @value, @id) ->
   d3.select(@id).attr("style", "width: 500px; margin: 15px;")
   @myslider = $(@id).slider
     min: @min
     max: @max
     value: @value
   $(@id).bind
  slide: @slideme

 slideme: (event, ui) =>
   $(@id +"_data").val(@value)

$(document).ready ->
  slider1 = new Slider(0,800,100,'#testslider')
  $("#testslider_data").val($("#testslider").slider("value"))

---

使用滑块时，我需要做什么才能使幻灯片的值显示在html中？

缩进已关闭。这：

 $(@id).bind
slide: @slideme

应该是这样的：

$(@id).bind
  slide: @slideme

或：

或者我个人最喜欢的：

$(@id).bind(slide: @slideme)

CoffeeScript对空格和格式非常敏感，您的格式定义了大部分代码的结构，因此您必须谨慎且一致；你混合了一个和两个空格，这只会带来麻烦

您的原始代码：

constructor: (@min, @max, @value, @id) ->
  #...
  $(@id).bind
 slide: @slideme

将被视为这样：

constructor: (@min, @max, @value, @id) ->
  #...
  $(@id).bind

slide: @slideme

因此，用于

bind

的

slide:@slideme

参数将看起来像类的另一个属性，并最终成为以下JavaScript:

Slider.prototype.slide = Slider.slideme;

---

将您的代码粘贴到的TRY COFFEESCRIPT面板中，您将看到它认为您的COFFEESCRIPT是什么意思。

您好，感谢您的快速反馈。缩进是关闭的，但更多的是通过粘贴在这里，而不是在原来的。“$（@id）.bind（slide:@slideme）”现在导致此错误：TypeError:this.id不是函数，因此滑块不会更新值。在

slideme

中

@id

是什么？你确定这个函数看起来像

$（@id+“\u data”）.val（@value）

而不是

$（@id“\u data”）.val（@value）

？对于这个问题，正确的答案是“{@id}\u data”，因为我想组合字符串。数据现在已更新。我的代码现在看起来是这样的：“slideme:（event，ui）=>@value=@myslider.slider（“value”）$（“{@id}}\u data”）.val（@value）”，其中值在发送到数据字段之前更新。谢谢你的提示-@mu太短了

Slider.prototype.slide = Slider.slideme;