尝试我在Opal/JQuery上的尝试。我的app.rb文件如下所示:
require 'opal'
require 'opal-jquery'
class HTMLObject
def initialize
end
def write_to_body
end
end
class HTMLParagraph < HTMLObject
attr_accessor :inner_html
def initialize(text)
@inner_html= text
end
def write_to_body
@body = Element.find("#body")
@body.append(Element("<p>#{@inner_html}"))
end
end
p = HTMLParagraph.new("hello world")
p.write_to_body我使用站点中的示例将其编译为app.js。我用index.html在我的web浏览器中运行它:
<!DOCTYPE html>
<html>
<head>
<script src="jquery-1.10.1.min.js" type="text/javascript"></script>
<script src="opal.js" type="text/javascript"></script>
<script src="opal-jquery.min.js" type="text/javascript"></script>
<script src="opal-parser.js" type="text/javascript"></script>
<script src="app.js" type="text/javascript"></script>
<title></title>
</head>
<body>
</body>
</html>当我打开页面时,我什么也看不到。控制台显示以下错误跟踪:
Uncaught NameError: uninitialized constant Object::Element opal.js:1531
def.$backtrace.backtrace opal.js:1531
def.$raise opal.js:1279
def.$const_missing opal.js:575
Opal.cm opal.js:255
def.$write_to_body app.js:44
(anonymous function) app.js:51
(anonymous function)JS输出文件如下所示:
function(__opal) {
var p = nil, _a, _b, self = __opal.top, __scope = __opal, nil = __opal.nil, $mm = __opal.mm, __breaker = __opal.breaker, __slice = __opal.slice, __klass = __opal.klass;
(function(__base, __super){
function HTMLObject() {};
HTMLObject = __klass(__base, __super, "HTMLObject", HTMLObject);
var def = HTMLObject.prototype, __scope = HTMLObject._scope;
def.$initialize = function() {
return nil;
};
def.$write_to_body = function() {
return nil;
};
return nil;
})(self, null);
(function(__base, __super){
function HTMLParagraph() {};
HTMLParagraph = __klass(__base, __super, "HTMLParagraph", HTMLParagraph);
var def = HTMLParagraph.prototype, __scope = HTMLParagraph._scope;
def.inner_html = def.body = nil;
def.$inner_html = function() {
return this.inner_html
},
def['$inner_html='] = function(val) {
return this.inner_html = val
}, nil;
def.$initialize = function(text) {
return this.inner_html = text;
};
def.$write_to_body = function() {
var _a, _b, _c;
this.body = ((_a = ((_b = __scope.Element) == null ? __opal.cm("Element") : _b)).$find || $mm('find')).call(_a, "#body");
return ((_b = this.body).$append || $mm('append')).call(_b, ((_c = this).$Element || $mm('Element')).call(_c, "<p>" + (this.inner_html)));
};
return nil;
})(self, ((_a = __scope.HTMLObject) == null ? __opal.cm("HTMLObject") : _a));
p = ((_a = ((_b = __scope.HTMLParagraph) == null ? __opal.cm("HTMLParagraph") : _b)).$new || $mm('new')).call(_a, "hello world");
return ((_b = p).$write_to_body || $mm('write_to_body')).call(_b);
})(Opal);有什么想法吗?
发布于 2013-05-24 00:44:05
试着把opal和opal-jquery直接放到你的html中,去掉app.rb之外的requires,你可以从http://cdnjs.com中获取它们。
否则,我希望看到编译后的app.js (您可以将其放在gist中)。
发布于 2013-05-19 10:36:22
最初,我认为这可能是因为您不需要opal-jquery gem (我假设您已经安装了它)。另一种猜测是:也许您的HTML文件中需要一个<script src="opal-jquery.js"></script>?
发布于 2013-09-28 20:44:24
看看这里:https://github.com/opal/opal-jquery/issues/26#issuecomment-25285375
我遇到了完全相同的问题,多亏了opal作者/管理员,我才把它们解决了。
https://stackoverflow.com/questions/16629602
复制相似问题