1

私のアプリケーションはノックアウトに基づいており、私にとって大きなハードルは次のとおりです。

  1. メインの親ファイルに必要な JS ファイルを添付しました
  2. iFrame でこれらのファイルを参照する方法を使用しました。たとえば、jQuery は親でのみ定義され、iframe でオブジェクトを定義する iframe から参照するだけです。
  3. 同様に、ノックアウト オブジェクトを定義して使用することはできますが、問題は、iframe ページのバインディングが機能しないことです。
  4. アラートを使用してノックアウトの機能が機能しているかどうかを確認すると、機能しています。フォーム フィールドとデータ バインディングのみが機能しない

どんな手掛かり？

コードは次のとおりです: 親ファイル (頭の下):

 <script type="text/javascript" src="Scripts/jquery-1.8.2.min.js"></script>
<script type="text/javascript" src="Scripts/jquery-ui-1.8.20.min.js"></script>

(ボディ下)

<iframe src="IframePage.html" width="100%" height="100%" id="popUpIframe" marginwidth="0" marginheight="0" frameborder="0" scrolling="auto"></iframe>

iframe ファイル:

<script type="text/javascript">   
    var $ = parent.$;
    var ko = parent.ko;    
    $(document).ready(function () { 
        var ViewModel = function (first, last) {
            this.firstName = ko.observable(first);
            this.lastName = ko.observable(last);

            this.fullName = ko.computed(function () {
                alert(this.firstName() + " " + this.lastName());
                return this.firstName() + " " + this.lastName();
            }, this);
        };        
         ko.applyBindings(new ViewModel("Kawal", "Babra"));
    });
</script>
<p>First name: <input data-bind="value: firstName" /></p>
<p>Last name: <input data-bind="value: lastName" /></p>
<h2>Hello, <span data-bind="text: fullName"> </span>!</h2>
4

1 に答える 1

0

ルート要素を iframe のドキュメント内の要素に指定するだけです。たとえば、次のようになります。

ko.applyBindings(Model, document.body);

これが実際の例です: http://jsfiddle.net/rD8uR/

iframe ドキュメントは次のとおりです: http://fiddle.jshell.net/KkPdE/show/light/

于 2013-03-19T12:38:45.720 に答える