我正在尝试从 sql 数据库中获取一些数据并通过 AJAX 请求将其传递,然后使用 Handlebars 对其进行模板化。PHP是这样的:
<?php
function isXHR() {
return isset( $_SERVER['HTTP_X_REQUESTED_WITH'] );
}
function connect(){
global $pdo;
$pdo = new PDO("mysql:host=localhost;dbname=personal", "root", "");
}
function get_photos( ) {
global $pdo;
$stmt = $pdo->prepare('
SELECT url, name, smt
FROM photos
LIMIT 50');
$stmt->execute();
return $stmt->fetchAll( PDO::FETCH_OBJ );
}
页面索引是这样的:
<?php
require 'functions.php';
connect();
if ( isXHR() )
{
echo json_encode( get_photos() );
return;
}
?>
<ul class="photos_list">
<script id="photo_list_template" type="text/x-handlebars-template">
{{#each this}}
<li data-smt="{{smt}}">
<img src="{{url}}" alt="{{name}}"/>
</li>
{{/each}}
</script>
</ul>
jQuery是这样的:
var photos = {
init: function( config ) {
this.config = config;
this.setupTemplates();
this.fetchphotos();
$.ajaxSetup({
url: 'index.php',
type: 'POST'
});
},
setupTemplates: function() {
this.config.photoListTemplate = Handlebars.compile( this.config.photoListTemplate);
},
fetchphotos: function() {
var self = photos;
$.ajax({
dataType: 'json',
success: function(results) {
console.log(results);
self.config.photosList.empty();
if ( results[0] ) {
self.config.photosList.append( self.config.photoListTemplate( results) );
} else {
self.config.photosList.append('<li>Nothing returned.</li>');
}
}
});
}
};
photos.init({
photoListTemplate: $('#photo_list_template').html(),
photosList: $('ul.photos_list')
});
我不知道如何让它工作,但我知道我做错了什么。这是我第一次使用 PHP 和 ajax 请求,所以我真的不知道如何找到错误。