1

私はBackbone.jsとそれがどのように機能するかを理解しようとしています。任意の値をとる2つのテキストボックスを作成し、ボタン（Multipy）をクリックすると、値が下のボックスに表示されます。これは機能しますが、2つの値の乗算を3番目のボックスに表示したいのですが、両方を割り当てようとしました。値を変数に変換して乗算しますが、機能しないようです。テキストボックスからの戻り値に問題があると思います。NANだと思います。とにかく見てアドバイスしてください。動作していないコードをコメントアウトしました。ライブURL：http ://egoless.co.uk/learning/learn_backbone/first-backbone-app.php

  <!DOCTYPE html>
  <html>
    <head>
    <title>Testing</title>
    <script type="text/javascript" src="jquery.js"></script>
    <script type="text/javascript" src="underscore.js">
  </script><script type="text/javascript" src="backbone.js"></script>
  <style>
  .size {
    width: 100px;
    height: 30px;
    border: solid 1px red;
    float: left;
    margin-left: 10px;
    text-align: center;
    font-weight: bold;
  }
  </style>
    </head>
    <body>
    <input type="text" id="box1" />
  &nbsp;
  <input type="text" id="box2" />
  &nbsp;
  <button id="myBtn">Multiply</button>
  <br>
  <br>
  <div id="myBox" class="size"></div>
  <div id="myBox2" class="size"></div>
  <div id="myBox3" class="size"></div>

  <script>

  (function($){
  //defining model 1
    PersonModel1 = Backbone.Model.extend({

      defaults:{
              age : function(){

               return  $("input#box1").val();

              }
          }
    });

    myPerson1 = new PersonModel1();

    //defining model 2
    PersonModel2 = Backbone.Model.extend({

      defaults:{
              age : function(){

               return $("input#box2").val();

              }
      }
    });

    myPerson2 = new PersonModel2();

    //defining collection


    Group = Backbone.Collection.extend({
          Model: PersonModel1,
          Model: PersonModel2,
          url:"#"

      })

          People = new Group([]);
          People.add(myPerson1);
          People.add(myPerson2);  

    //adding view

    ResultView = Backbone.View.extend({
          el:'button',
          events:{
              'click':'render'
          },
        render:function(){

          val1 = myPerson1.get('age');
          val2 = myPerson2.get('age')
          val3 = val1*val2 // not working
          $('div#myBox').html(val1);
          $('div#myBox2').html(val2);
          $('div#myBox3').html(val3); // not working
          $('input#box1').val("");
          $('input#box2').val("");
          return this;
          }
      })




    $(document).ready(function(e) {
       myResultView = new ResultView();
    });

  })(jQuery);

  </script>
  </body>
  </html>
4

1 に答える 1

0

モデル定義のデフォルト セクションでは、属性にのみ値を割り当てることができます。値 age を返すには、別の関数を記述する必要があります。

          defaults:{},
          age : function(){
           return  $("input#box1").val();
          }

そして、あなたはこのように呼び出すことができます

      val1 = myPerson1.age();
      val2 = myPerson2.age();
      val3 = val1*val2 ;
于 2013-01-24T19:03:34.637 に答える