したがって、ステップ 1 とステップ 2 の 2 つのステップがあるという問題があります。この問題は IE にのみ存在します。現在、IE10 を使用していますが、互換モードでは同じ問題が再現されます。
サンプルプロジェクトを添付しました。HomeController の「GetStep1」アクションにブレークポイントを配置した場合。IE10 で再度押しても、ブレークポイントがキャッチされないことがわかります。私が間違っていることを教えてください。
ここから例をダウンロードしてください: http://sdrv.ms/19mrZL7
_Layout.cshtml
<!DOCTYPE html>
<html>
<head>
<title>@ViewBag.Title</title>
<link href="@Url.Content("~/Content/Site.css")" rel="stylesheet" type="text/css" />
<script src="@Url.Content("~/Scripts/jquery-1.7.1.min.js")" type="text/javascript"></script>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js" type="text/javascript"></script>
<script src="//ajax.googleapis.com/ajax/libs/jqueryui/1.9.1/jquery-ui.min.js" type="text/javascript"></script>
<script src="@Url.Content("~/Scripts/jquery.unobtrusive-ajax.min.js")" type="text/javascript"></script>
<script src="@Url.Content("~/Scripts/knockout-2.3.0.js")" type="text/javascript"></script>
<script src="@Url.Content("~/Scripts/sammy-0.7.4.js")" type="text/javascript"></script>
<script src="@Url.Content("~/Scripts/knockout.mapping-latest.js")" type="text/javascript"></script>
<script src="@Url.Content("~/Scripts/json2.js")" type="text/javascript"></script>
</head>
<body>
<div class="page">
<div id="header">
<div id="title">
<h1>My MVC Application</h1>
</div>
<div id="logindisplay">
@Html.Partial("_LogOnPartial")
</div>
<div id="menucontainer">
<ul id="menu">
<li>@Html.ActionLink("Home", "Index", "Home")</li>
<li>@Html.ActionLink("About", "About", "Home")</li>
</ul>
</div>
</div>
<div id="main">
@RenderBody()
</div>
<div id="footer">
</div>
</div>
@RenderSection("scripts", false)
</body>
</html>
インデックス.cshtml
@{
ViewBag.Title = "Home Page";
}
<ul>
<li id="Step-1">
<a href="#Step1">Step1</a>
</li>
<li id="Step-2">
<a href="#Step2">Step2</a>
</li>
</ul>
<div id="dynamicData">
</div>
@section scripts{
<script type="text/javascript">
var IndexViewModel = function () {
var self = this;
self.selectedStep = ko.observable();
Sammy(function () {
this.get('#Step1', function () {
console.log('here');
$.ajax({
url: '/Home/GetStep1',
type: "GET",
success: function (result) {
$('#dynamicData').html(result);
self.selectedStep(1);
}
});
});
this.get('#Step2', function () {
$.ajax({
url: '/Home/GetStep2',
type: "GET",
success: function (result) {
$('#dynamicData').html(result);
self.selectedStep(2);
}
});
});
this.notFound = function () {
//console.log(location.hash);
};
}).run('#Step1');
};
ko.applyBindings(new IndexViewModel());
</script>
}
_Step1.cshtml
<h1>Step 1</h1>
<div id="step1-view">
<h1 data-bind="text: SelectedValue"></h1>
<ul data-bind="foreach: Collection">
<li data-bind="css: {'selected' : $data === $root.SelectedValue()}, click: $root.setValue"><span data-bind="text: $data"></span></li>
</ul>
@*<span data-bind="text: ko.toJSON($data)"></span>*@
</div>
<script type="text/javascript">
var viewModel = ko.mapping.fromJS(@Html.Raw(Json.Encode(Model)));
viewModel.setValue = function (item) {
viewModel.SelectedValue(item);
}
ko.applyBindings(viewModel, document.getElementById("step1-view"));
</script>
HomeController.cs
[HttpGet]
public ActionResult GetStep1()
{
return PartialView("_Step1", new Step1ViewModel());
}
[HttpGet]
public ActionResult GetStep2()
{
return PartialView("_Step2", new Step2ViewModel());
}