Ajaxでテキストデータを取得して、コンソール画面に表示させたい。
以下の様に記述していますが、sample01.txtの中身が表示されません。基本的なところだと思いますが、何がダメなのかわからないため、ご教授お願いします。
【ajax0108.html】
該当のソースコード
<!doctype html>
<html lang="ja">
<head>
<meta charset="UTF-8">
<title>Ajax練習</title>
<link rel="stylesheet" href="//ajax.googleapis.com/ajax/libs/jqueryui/1.11.1/themes/smoothness/jquery-ui.css"/>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<script src="//ajax.googleapis.com/ajax/libs/jqueryui/1.10.4/jquery-ui.min.js"></script>
<script type="text/javascript">
$("#sample1").on("click" , function() {
$.ajax( {
url: 'sample01.txt' ,
type: "GET" ,
dataType: "text" ,
success: function (data) {
console.log(data);
}
});
});
</script>
</head>
<body>
<form>
<input type="button" id="sample1" value="サンプル1">
</form>
</body>
</html>
【sample01.txt】
やせ蛙 負けるな一茶 これにあり
###試したこと
ブラウザはchrome,firefoxで試してNGで絵師た。
2つのファイルは同階層です。
sample01.txtに直接アクセスすれば表示されます。
consoleには何も(エラーなども)表示なし。
以上です。