0

我有来自 YUI 官方网站的 Dial 示例，它很棒。我在 JS 文件中有该函数并且工作正常，但我想在 html 页面中使用一些参数（如值、最小值、最大值等）调用它，但没有任何作用。

拨号功能是这样的：

YUI().use('dial', function(Y) {

    var dial = new Y.Dial({
        min:-220,
        max:220,
        stepsPerRevolution:100,
        value: 30
    });
    dial.render('#demo');

}

太感谢了！

编辑：我将编写一个非常简单的 C++ 代码，我想你会明白我想要什么：

int a = 3;int b = 4;
example (a, b);

a=2;b=4;
example (a, b);

void example (a, b){  //this shoud be the dial function in a JS file
    int c = a + b;
    cout << c; 
}

如您所见，每次我调用“示例”时我都会打印 C 并在每次调用它时指定我想要的值。如果我调用示例 8 次，它将打印 C 变量 8 次。这就是我想要的表盘。我想调用尽可能多的函数，该函数使用我需要的参数从 HTML 页面创建 Dial，并且该函数将使用这些参数创建 Dial。我不知道这是否可能，但我需要这个，所以谢谢你的帮助！:)

4

2 回答 2

0

您不会从 HTML 中调用 JavaScript 代码。相反，您监听 HTML 中发生的事件并做出响应。

例如，假设你有这个：

显示表盘

然后你要做的是：

Y.one('#go').on('click', function () {
    var dial = new Y.Dial({
       min:-220,
       max:220,
       stepsPerRevolution:100,
       value: Y.one('#value').get('value');
    });
    dial.render('#demo');
});
于 2012-10-26T14:11:31.540 回答
0

您的 HTML 应包含如下内容：

<div id="demo"></div>
<script src="http://yui.yahooapis.com/3.7.3/build/yui/yui-min.js"></script>  
<script>
YUI().use('dial', function (Y) {
    var dial = new Y.Dial({
        min:-220,
        max:220,
        stepsPerRevolution:100,
        value: 30
    });
    dial.render('#demo');
});
</script>

那不适合你吗？

编辑：根据评论中的讨论添加另一个示例。你可以这样做：

HTML 文件：

<div id="demo"></div>
<script src="http://yui.yahooapis.com/3.7.3/build/yui/yui-min.js"></script>  
<script>
    var dialConfig = {
        min:-220,
        max:220,
        stepsPerRevolution:100,
        value: 30
    }
</script>
<script src="/path/to/initialize-widgets.js"></script>

初始化小部件.js 文件：

YUI().use('dial', function (Y) {
    var dial = new Y.Dial(dialConfig);
    dial.render('#demo');
    // possibly do more setup work after this... 
});
于 2012-10-26T11:11:44.840 回答