简体   繁体   English

Coffeescript和jQuery TypeError

[英]Coffeescript and jQuery TypeError

I recently had a little problem using a jquery plugin with coffeescript (within the Rails 3.1 asset pipeline, if that helps). 我最近在使用带有咖啡脚本的jquery插件时遇到了一个小问题(如果有帮助的话,在Rails 3.1资产管道中)。 I looked around a bit, but couldn't really figure out, why it behaves this way. 我环顾了一下,但无法弄清楚为什么会这样。

So, why does this not work (talking about the corner call on $('.overlaybox')): 因此,为什么这不起作用(谈论$('。overlaybox')的角落呼叫):

$ ->
  $('#slides').sortable
    axis: 'y'
    update: ->
      $.post($(this).data('update-url'), $(this).sortable('serialize'))

  $(".overlaybox").corner()

but this does work (took the corners call out of the jQuery ready thing): 但这确实有效(将jQuery做好的准备付诸东流):

$ ->
  $('#slides').sortable
    axis: 'y'
    update: ->
      $.post($(this).data('update-url'), $(this).sortable('serialize'))

$(".overlaybox").corner()

I keep getting a 我不断得到

TypeError: 'undefined' is not a function (evaluating '$(".overlaybox").corner()')

if I leave it in there.. Maybe I'm just blind right now, but I can't figure out why I can't leave it in there. 如果我把它留在那里。也许我现在只是瞎子,但我不知道为什么我不能把它留在那里。 Even the compiled code looks legit (at least to me it does ;-)). 甚至编译后的代码看起来都是合法的(至少对我来说是这样;-))。

Thanks so much for your time and clarifying. 非常感谢您的时间和澄清。

Marcel 马塞尔

UPDATE Here's some relative code: 更新以下是一些相关代码:

# app/assets/javascripts/application.js
//= require jquery
//= require jquery-ui
//= require jquery_ujs
//= require jquery.Jcrop
//= require jquery.corner
//= require jqtextile
//= require_tree .

# app/assets/javascripts/slides.js
$ ->
  $(".overlaybox").draggable 
    containment: 'parent',
    drag: -> 
        offset = $(this).position()
        xPos = offset.left
        yPos = offset.top
        $('#slide_xpos').val(xPos)
        $('#slide_ypos').val(yPos)


  $('#slides').sortable
        axis: 'y'
    update: ->
        $.post($(this).data('update-url'), $(this).sortable('serialize'))

  $(".overlaybox").corner()

And then the view (app/views/slides/_form.html). 然后是视图(app / views / slides / _form.html)。 The funny thing is, that corners works, as soon as I take it out of the jquery document ready event. 有趣的是,只要我将其从jquery文档ready事件中删除,该角就可以工作。 I think I'm missing something substantial regarding the scope of all of this: When I do a console.log inside the $ -> on corner, I get an undefined. 我想我在所有这些方面的范围上都缺少一些实质性的内容:当我在$->拐角处执行console.log时,得到的是未定义的。 But when I do the same outside of the $ -> (actually below), I get the proper output AND it gets fired even before the jquery (of course). 但是,当我在$->(实际上在下面)之外执行相同操作时,我得到了正确的输出,并且甚至在jquery之前就被激发了(当然)。 But why is it not available in the jQuery block? 但是,为什么它在jQuery块中不可用? Is it a scope thing with coffeescript I'm missing? 我想念的那个带有CoffeeScript的示波器吗? (I'm having the same problem with a different plugin right now) (我现在使用其他插件遇到相同的问题)

Thanks so much again! 再次非常感谢!

here's also the compiled javascript code, if that helps 这也是编译的javascript代码,如果有帮助的话

$(function() {
    console.log($('.overlaybox'));
    console.log($('.overlaybox').corner);
    $(".overlaybox").draggable({
      containment: 'parent',
      drag: function() {
        var offset, xPos, yPos;
        offset = $(this).position();
        xPos = offset.left;
        yPos = offset.top;
        $('#slide_xpos').val(xPos);
        return $('#slide_ypos').val(yPos);
      }
    });
    $('#slides').sortable({
      axis: 'y',
      update: function() {
        return $.post($(this).data('update-url'), $(this).sortable('serialize'));
      }
    });
    return $(".overlaybox").corner();
  });

Well, the problem was, that I had some precompiled assets (older stuff) in my rails public folder, that was kinda messing with my jQuery calls. 嗯,问题是,我的rails公用文件夹中有一些预编译的资产(旧的东西),这有点弄乱了我的jQuery调用。 Cleared it, learned my lessen, everything works now as expected. 清除它,吸取我的教训,一切都按预期工作。

Anyway, thanks so much guys, I really appreciate your help! 无论如何,非常感谢你们,我非常感谢您的帮助!

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM