javascript - 引用错误 : Handlebars is not defined

标签 javascript handlebars.js

我对 Handlebars.js 完全陌生,对 JavaScript 本身几乎是陌生的。我在控制台上收到此错误“ReferenceError: Handlebars is not defined”。我已经尝试将所有引用放在“x-handlebars-templates”之前,但没有帮助。

索引.tmpl.php:

<html>

 <meta content="text/html;charset=utf-8" http-equiv="Content-Type">
 <meta content="utf-8" http-equiv="encoding">
 <link rel="stylesheet" type="text/css" href="style.css">

<title>PHP and jquery</title>
</head>

<body>
 
 <div class="container">
 

<h1>Search films by title:</h1>
<form id="film-selection" action="index.php" method="post">
	
	<select name="q" id="q">
		<?php
           $alphabet = str_split('abcdefghijklmnopqrstuvwxyz');
           foreach ($alphabet as $letter) {
           	 echo "<option value='$letter'>$letter</option>";
           }
		?>
	</select>
	<button type="submit">Go!</button>
</form>

	 <?php if(isset($film)): ?>
		<ul class="film-list">
			<?php
		       foreach ($film as $a) {
		       	 echo " <li data-film_id='{$a->film_id}'> 
		       	           <a href='film.php?film_id={$a->film_id}'>{$a->title} </a>
		       	        </li>";
		       }
			?>

		</ul>
	 <?php endif; ?>



<script id="film_list_template" type="text/x-handlebares-templates">
	 {{#each this}}
         <li data-film_id="{{film_id}}">
            <a href="film.php?film_id={{film_id}}">{{fulName this}}</a>
         </li>
     {{/each}}

</script>

  <script type="text/javascript" src="js/jquery.js"></script>
  <script type="text/javascript" src="js/handlebars-v2.0.0.js"></script>
  <script type="text/javascript" src="js/script.js"></script>

 </div>

</body>

</html>

脚本.js:

var Film = {
	init: function(config){
		this.config = config;
		this.setupTemplates();
		this.bindEvents();

	},

	bindEvents: function(){
		this.config.letterSection.on('change', this.fetchFilm);

	},

	setupTemplates: function(){
      //The error is in this line below. 
      this.config.filmListTemplate = Handlebars.compile(this.config.filmListTemplate); //here is the error
      Handlebars.registerHelper('fulName', function(film){
          return film.title;
      });
	},

	fetchFilm: function(){
	  alert('Test2');
	     
	  var self = Film;
	
	  $.ajax({
	  	url: 'index.php',
	  	type: 'POST',
	  	data: self.config.form.serialize(),
	  	dataType: 'json',
	  	success: function(results){
	  	  //console.log(results[0].title);
	  	  self.config.filmList.append(self.config.filmListTemplate(results));

	  	}
	  });
	}
};

Film.init({
   letterSection: $('#q'),
   form: $('#film-selection'),
   filmListTemplate: $('#film_list_template').html(),
   filmList: $('ul.film-list')
});

最佳答案

我发现我的 js 目录中没有文件“handlebars-v2.0.0.js”。

关于javascript - 引用错误 : Handlebars is not defined,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/27645823/

相关文章:

node.js - 在带有 Handlebars 的 KeystoneJS 中添加额外的内容 block

ruby-on-rails - Backbone.js + Handlebars 每个

javascript - div 内带有 Backbone 的 Handlebars 模板不渲染

javascript - jquery 不发布数组数据

javascript - 编辑内容可编辑的页面并使用 php 保存

javascript - JQuery 单击事件在第二次单击时触发,但在第一次单击时不触发

ember.js - 如何在循环的第一项中设置事件类?

javascript - 如何使用handlebars来处理这样复杂的JSON数据?

javascript - 带有数据的 XML 模式?我如何用JS解析它?

javascript - 将数组传递给函数 - PG 和 NodeJS