Javascriptの初心者として、ノックアウトを試してみることにしました。しかし、私はそれを非常に簡単なシナリオで動作させることさえできませんでした。ノックアウト・テキスト・バインディングが入力用に機能しない
私は問題が非常に単純であると推測しています。私はここでこれを尋ねるのは恥ずかしいものです。しかし、私はJavascriptをデバッグするのがうまくいかず、バグがどのように現れるかわからないので、ここでは行きます。それはasp.net MVC 3によって生成されています後
これは、ページのHTMLソースです:
<html>
<head>
<title>Index</title>
<link href="/Content/Site.css" rel="stylesheet" type="text/css" />
<script src="/Scripts/jquery-1.5.1.min.js" type="text/javascript"></script>
</head>
<body>
<h2>Index</h2>
<script src="/Scripts/knockout-1.3.0beta.debug.js" type="text/javascript"></script>
<script src="/Scripts/knockout-1.3.0beta.js" type="text/javascript"></script>
<script type="text/javascript">
var viewModel = {
name: "Joe",
number: "13"
};
</script>
<script type="text/javascript">
ko.applyBindings(viewModel);
</script>
<ul>
<li>Name: <input data-bind="text: name"/></li>
<li>Number: <input data-bind="text: number"/></li>
</ul>
<ul>
<li>Name: <span data-bind="text: name"></span></li>
<li>Number: <span data-bind="text: number"></span></li>
</ul>
</body>
</html>
ジョーまたは13は、入力またはテキストボックスにバインドされません。
ko.observable()に入れてみましたが、deosも動作しません。スクリプトが実行されていないのと同じです。
FireBugを使用してデバッグを試みましたが、applyBindingが実行され、viewModelオブジェクトに正しい変数が含まれていることがわかりました。
ここでは、おそらく明らかなことがあります。ここでそれを見ることができない場合は、FireBugを使用するときに私が探すべきことを指摘できますか?
EDIT
私はまだ問題を抱えている特定のソリューションのいくつかの組み合わせを試した後。一つの解決策ではHTMLは次のようになります。
<html>
<head>
<title>Index</title>
<link href="/Content/Site.css" rel="stylesheet" type="text/css" />
<script src="/Scripts/jquery-1.5.1.min.js" type="text/javascript"></script>
<script src="/Scripts/knockout-1.3.0beta.debug.js" type="text/javascript"></script>
<script type="text/javascript">
var viewModel = {
name: ko.observable("Joe"),
number: ko.observable("13")
};
</script>
<script type="text/javascript">
$(function() { ko.applyBindings(viewModel); })
</script>
</head>
<body>
<h2>Index</h2>
<ul>
<li>Name: <input data-bind="text: name"></input></li>
<li>Number: <input data-bind="text: number"></input></li>
</ul>
<ul>
<li>Name: <span data-bind="text: name"></span></li>
<li>Number: <span data-bind="text: number"></span></li>
</ul>
</body>
</html>
は、私は彼らがすべて同じ作業に使用されapplyBindingsソリューションは関係していないようです。
バインディングは最終的には動作しますが、IEとFirefoxでは動作しますが、Chromeでは動作しません。また、観測可能性は全く機能しません。私は入力フィールドに書いてフィールドを更新することはできません。
わかりました。このjquery.readyメソッドを使用するための規約はありますか?私はそれについて調べるために私はそれをgoogleできると思います。 –
$(document).ready(ko.applyBindings(viewModel))はそのトリックを行う必要がありますか?動いていない。 –
$(function(){ko。 –