0

ページに 2 つの div があります。最初の div には、2 つのオプションを持つナビゲーション バーが含まれています。私がやりたいことは、ナビゲーションバーのオプションをクリックしたときに、対応する html ファイルを 2 番目の div にロードすることです。これを行うにはどうすればよいですか。助けてください。

ここに私のコードがあります..

<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8">
<title>Test Document</title>
<meta name="viewport" content="width=device-width, minimum-scale=1, maximum-scale=1" />
<link rel="stylesheet" href="http://code.jquery.com/mobile/1.0.1/jquery.mobile-1.0.1.min.css" />
<script src="http://code.jquery.com/jquery-1.6.4.min.js"></script>
<script src="http://code.jquery.com/mobile/1.0.1/jquery.mobile-1.0.1.min.js"></script>

<script type = "text/javascript">
function loadSurveyPage()
{
alert("Survey");
$('#myBody').load('survey.html #myQuestions');
}

function howToSurvey()
{
alert("How to Survey");
$('#myBody').load('howToSurvey.html #myQuestions');
}
</script>
</head>
<body id="myBody">



<div data-role="page" id="indexPage">

<div  data-role="header" data-position="fixed">
<div data-role="navbar" id="navbar">
<ul>
    <li><a href="#" rel="external" onclick="howToSurvey()">How To Take The Survey</a></li>
    <li><a href="#" onclick="loadSurveyPage()">Take Survey</a></li>    
</ul>
</div>
</div>

<div data-role="content" id="myQuestions"></div>
</div>



</body>
</html>

オプションをクリックすると、次のエラーが表示されます。

XMLHttpRequest は file:///C:/Users/sp05/Desktop/Self/TMS/testForTab/howToSurvey.html を読み込めません。Origin null は、Access-Control-Allow-Origin では許可されていません。

4

2 に答える 2

1
  1. 開発にはローカル Web サーバーを使用する必要があります (例: IIS for Windows)。ここで発生した問題は、セキュリティの問題である可能性があります。
  2. .load() メソッドを間違って使用しています。selector 引数は、返される html の要素を指します。代わりに .get() または .post() を使用してください: http://api.jquery.com/category/ajax/shorthand-methods/
于 2013-02-23T10:27:00.800 に答える
0

私はいくつかのクロスドメインの問題に直面していました...同じプロジェクトをワンプサーバーで実行しましたが、完全に機能しました..

于 2013-05-21T12:55:51.990 に答える