1

基本的な knockout.js スクリプトを実行するのに少し問題があります。ファイルが正しく読み込まれていないのか、それとも別の問題なのかわかりません。

基本的に、ローカルホストで機能するチュートリアルのスニペットを取得しようとしています。関数「names」を呼び出すPHPを使用しています。すべきことは、javascript ファイルにリストされている名前を表示することだけです。チュートリアルはここにあります

//on name_test.php
<head>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script>
<script src="http://github.com/downloads/SteveSanderson/knockout/knockout-2.0.0.js"></script>
<script src="name_test.js"></script>  //name_test.js is in the folder with all of my other files
</head>

//bunch of irrelevant code omitted

<?
function names(){
    ?>
    <p>First name: <strong data-bind="text: firstName"></strong></p>
    <p>Last name: <strong data-bind="text: lastName"></strong></p>
    <?
}
?>

ここにJavaScriptファイルがあります

// name_test.js
function AppViewModel() {
  this.firstName = "first name here";
  this.lastName = "last name here";
}

ko.applyBindings(new AppViewModel());

今、ページが読み込まれると、私が見るのは

First name:
Last name:

私がここに欠けているものはありますか？javascript ファイルは、他のすべてのファイルと一緒にディレクトリにあります。また、パス全体を（xamppで）試しましたが、まだ何も表示されません。

4

3 に答える 3

2

<script>タグは解析時に実行されます。関数の実行時applyBindings()には、DOM はまだロードされていません。window.onloadDOM がロードされた後 (スクリプトの下部)、またはjQuery などで実行する必要があります$(document).ready()。

// name_test.js
function AppViewModel() {
  this.firstName = "first name here";
  this.lastName = "last name here";
}

// Run after the window has loaded    
window.onload = function() {
  ko.applyBindings(new AppViewModel())
};

// Or if you are using jQuery
$(document).ready(function() {
  ko.applyBindings(new AppViewModel())
});

これはKnockout observables ドキュメントに記載されています。

最後に、ドキュメントの最後に を移動することもできます<script src='name_test.js></script>。これにより、DOM の残りの部分が解析された後の解析時に読み込まれます。

于 2012-11-14T00:48:28.080 に答える
1

興味深いことに、私にとっては問題なく機能します。

HTMLファイル：

  • Script-Tagsを一番下に設定します
  • PHPコードを削除しました

だから私たちは持っています：

<p>First name: <strong data-bind="text: firstName"></strong></p>
<p>Last name: <strong data-bind="text: lastName"></strong></p>

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script>
<script src="http://github.com/downloads/SteveSanderson/knockout/knockout-2.0.0.js">   </script>
<script src="name_test.js"></script>

JS-ファイル（変更なし）：

function AppViewModel() {
  this.firstName = "first name here";
  this.lastName = "last name here";
}

ko.applyBindings(new AppViewModel());

PHPバージョンを使用する場合にも機能します（もちろん、宣言した後にnames（）関数を呼び出します。上記の例では、それを忘れたと思いますか？）

<?php
function names(){
    ?>
    <p>First name: <strong data-bind="text: firstName"></strong></p>
    <p>Last name: <strong data-bind="text: lastName"></strong></p>
    <?php
}
names();
?>

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script>
<script src="http://github.com/downloads/SteveSanderson/knockout/knockout-2.0.0.js"></script>
<script src="name_test.js"></script>

申し訳ありませんが、これ以上お役に立てませんが、問題はありません。そして、私はライブラリを使用していません。スクリプトタグだけを使用しています。

于 2012-11-14T01:12:05.830 に答える
0 
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script>

こんにちは、あなたはhttp://

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script>
于 2012-11-14T00:42:20.143 に答える