Question

我正在尝试通过将我的简单静态Web应用程序转换为单页Backbone应用程序来自学Backbone.js。我的问题是我无法找到解决问题的简单教程。

我有以下功能：

function convert(ins) {
    var numbers = parseFloat(ins);
    //Test for NAN
    if(isNAN(numbers)){
        $("#output").html("Error");
    }else{
        var conver = (numbers * 12);
        $("#output").html(conver);
    }
}

现在，当用户将数据输入字段时，会调用此函数。它会自动更新输出div。我想要有很多转换“应用”。并且当用户访问页面时，转换功能需要更新。我应该如何为每个页面制作模型？我想在转换函数中更改的唯一行是：

var conver = (numbers * 12);

我显然是骨干的新手，这是我开始重新处理网站代码之前需要解决的最后一个问题。

我真的很感激任何帮助。谢谢！

Answer 1

从您发布的代码开始，似乎所有发生的事情都是基于某些用户交互的一些转换，看起来没有支持模型的普通view就足够了。如果您的转换函数依赖于某些特定数据（例如来自您服务器的某些公式），那么可能需要model，但根据您发布的内容我并不真正看到需要。

例如，说你的标记类似于以下

  <div id="divConversionCalc">
    <label for="txtInputNum">Enter inches</label> <input type="number" id="txtInches" />
    <label>Feet</label> <div id="dvOutput"></div>

  </div>

您可以声明一个将封装您的函数的backbone.js视图，如下所示

    var ConversionView = Backbone.View.extend({
        el: '#divConversionCalc',

        events: {
            "change #txtInches": "convert"
        },

        convert: function (e) {
            var numbers = parseFloat(this.$el.find('#txtInches').val());
            if (isNaN(numbers)) {
                this.$el.find("#dvOutput").html("Error");
            } else {
                var conver = (numbers * 12);
                this.$el.find("#dvOutput").html(conver);
            }

        }

    });

    $(function () {
        new ConversionView();
    });

JSBin

Answer 2

看不到代码的其余部分，看起来您的问题是ins是一个字符串，并且您不能将字符串与Javascript中的数字相乘。如果你把它改为numbers * 12，你可能会很高兴。

创建一个简单的骨干应用

2 个答案: