ダイアログ(dialog.html)へのリンクを含むページ(test.html)があり、リストビュー(list.html)をロードします。これは、ie7 と ie8 を除くすべてのブラウザーで機能します。次に、ダイアログを別のページ (test2.html) にすると、ie7 と ie8 でリストが正しく読み込まれます。
何が実行されるかを調べるためにデバッグしようとしましconsole.log()
たが、ie8 で test.html から dialog.html が読み込まれると、dialog.html の JavaScript は実行されません。
これを解決する方法はありますか?
私の問題を表す 2 つの最小限の単純化された例:
https://zero3.dk/guru/testing/test.html
https://zero3.dk/guru/testing/test2.html
test.html
<!DOCTYPE html>
<html>
<head>
<title>test</title>
<link rel="stylesheet" href="styles/jquery.mobile-1.2.0.min.css" type="text/css">
<script type="text/javascript" src="scripts/jquery-1.8.2.min.js"></script>
<script type="text/javascript" src="scripts/jquery.mobile-1.2.0.min.js"></script>
</head>
<body>
<a href="dialog.html">Open dialog</a>
</body>
</html>
dialog.html
<div data-role="dialog">
<script>
$('#lp-list').load('list.html',function(){
$(this).trigger("create");
});
</script>
<div data-role="header" data-theme="b">
<h1>Lokationsvælger</h1>
</div>
<div data-role="content" id="lp-list">
</div>
</div>
list.html
<ul data-role="listview">
<li>First</li>
<li>Second</li>
<li>Third</li>
</ul>
test2.html
<!DOCTYPE html>
<html>
<head>
<title>test</title>
<link rel="stylesheet" href="styles/jquery.mobile-1.2.0.min.css" type="text/css">
<script type="text/javascript" src="scripts/jquery-1.8.2.min.js"></script>
<script type="text/javascript" src="scripts/jquery.mobile-1.2.0.min.js"></script>
<script>
console.log("1");
</script>
</head>
<body>
<div data-role="dialog">
<script>
$('#lp-list').load('list.html',function(){
$(this).trigger("create");
});
</script>
<div data-role="header" data-theme="b">
<h1>Lokationsvælger</h1>
</div>
<div data-role="content" id="lp-list">
</div>
</div>
</body>
</html>