Question

我对Coffeescript相对较新，我遇到了一些问题，我认为这些问题与瘦箭头和胖箭头/ _this vs this vs vs（this）有关。

我有以下类和构造函数：

class @scenarioEditPage
  constructor: ->
    @getParentAttributes()

和@getParentAttributes（）是

getParentAttributes: ->
    @properties = {}
    $("#form_configurable").find('input[type=hidden]').each (index, element) =>
      @properties[$(element).attr('id')] = element.val()

基本上我要做的是遍历表单中的所有隐藏字段，并将它们的值分配给属性哈希中的键/值对，以后可以使用。示例：隐藏的输入字段id=some_id和value=some_value变为properties[some_id] = some_value。

非常感谢任何帮助。谢谢！

Answer 1

首先，除非你真的需要，否则我不会使用class @scenariosEditPage。 class ScenariosEditPage会更好。

尝试这样的事情：http://jsfiddle.net/y6bgrfn2/

    class Test
        constructor: () ->
            @data = {}
            @loadData()

        loadData: ->
            $inputs = $("#container input").each (index, elem) =>
                $elem = $ elem
                @data[$elem.attr('id')] = $elem.val()

        getData: -> @data

    $(document).ready () ->
        test = new Test()
        console.log test.getData()

jQuery的each方法更改了内部代码的上下文，因此基本上您必须使用双箭头来保留上下文或带有额外变量的简单箭头，例如ctx = @，检查一下：

    # We have some method @doAnything, so :
    @doAnything
    # isnt undefined...

    # Now:
    # this works
    $('selector...').each (index, elem) =>
        # @ == this == caller's context
        @doAnything $(elem)

    # or this works fine
    ctx = @
    $('selector...').each () ->
        # this == DOM Element
        # ctx == caller's context
        # ! ctx isnt @ !
        ctx.doAnything $(this)

    # this doesnt work
    $('selector...').each () =>
        # @ == DOM Element, so @doAnything is undefined
        @doAnything $(this)

你的代码中有一个小错误：

    @properties[$(element).attr('id')] = element.val()

element.val（）是undefined，修复如下：

    @properties[$(element).attr('id')] = $(element).val()

或更好：

    $element = $ element
    @properties[$element.attr('id')] = $element.val()

Coffeescript jQuery每个循环

1 个答案: