Ajax jquery postスクリプトが機能しない

Question

このチュートリアルの後にはhttps://openenergymonitor.org/emon/node/107です。 私がしようとしているのは、jqueryとphpを使ってmysqlデータベースからデータを取得することです。 チュートリアルで述べたことを正確に実行しましたが、動作させることができません。 ページを読み込むと、エラーが発生します。

これは私がやったことです：

api.php：

$dbhandle = mysql_connect($hostname, $username, $password) 
or die("Unable to connect to MySQL"); 

$selected = mysql_select_db($db,$dbhandle) 
or die("Could not select examples"); 

$result = mysql_query("SELECT * FROM todolist"); 
$array = mysql_fetch_row($result); 

echo json_encode($array); 

（私はPDOを使用することをお勧めしていることを知っているが、これは単なるテストのためです。）

jqueryスクリプト：

<script language="javascript" type="text/javascript"> 
    $(function() { 
      $.ajax({          
       url: 'api.php', data: "", dataType: 'json', 
       success: function(data) { 
       var id = data[0]; 
       var description = data[1]; 
       $('#output').html("<b>id: </b>"+id+"<b> description: </b>"+description); 
       }, 
       error: function() { 
       alert("Fail"); 
       } 
      }); 
      }); 
    </script> 

私はapi.phpにアクセスすると、これは私が得るものです：

["161","true","werken\n","12"] 

私はにconsole.log（引数）を使用する場合、これが現れる：

[Object, "parsererror", SyntaxError: Unexpected token < in JSON at position 0 at Object.parse (native) at parseJSON …] 
0 
: 
Object 
1 
: 
"parsererror" 
2 
: 
SyntaxError: Unexpected token < in JSON at position 0 at Object.parse (native) at parseJSON (https://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js:16:11709) at b$ (https://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js:16:1382) at w (https://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js:18:8326) at XMLHttpRequest.d (https://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js:18:14247) 
callee 
: 
(err) 
length 
: 
3 
Symbol(Symbol.iterator) 
: 
values() 
__proto__ 
: 
Object 

私は約3この作品を作るためにしようとしています時間は今、それは私をかなり夢中にさせる。誰かが私のスクリプトでこの問題を説明できることを願っています。

編集：

私はそれを修正しました。 api.phpに含まれているページiに問題がありました。

Answer 1

おそらく絶対パスを使用していないURLが原因です。 ローカルマシンでこれを実行していますか？ 2つのスクリプト（htmlとphp）は同じディレクトリにありますか？

ブラウザの開発者ツールを使用して、ネットワークajaxコールを確認し、追跡する必要があります。おそらく404エラーが発生しています。

あなたはこれを行うことによって、エラーの詳細情報を取得できます。エラーの

error: function(err) { 
       console.log(err); 
       } 

詳細は、あなたの開発ツールのコンソールに表示されます。ほとんどの場合、開発ツールを開くには、Ctrl + Shift + I（PC）を押すか、ブラウザメニューを使用します。