ThinPHP5+jQuery博客开发日志

mac2025-11-27  12

基于ThinkPHP5开发博客的一些记录。

1.TP5视图输出

<?php namespace app\index\controller; use think\Controller; class Index extends Controller { public function hello($name = 'thinkphp') { $this->assign('name', $name); return $this->fetch(); } } 在控制器中输出视图时,需要使用use引入Controller类,并需要在控制器中继承extends该类。Index控制器类继承了 think\Controller类之后,我们可以直接使用封装好的assign和fetch方法进行模板变量赋值和渲染输出。fetch方法中我们没有指定任何模板,所以按照系统默认的规则视图目录/控制器/操作方法输出了view/index/hello.html模板文件。

2.模板输出替换

支持对视图输出的内容进行字符替换,例如:

namespace index\app\controller; class Index extends \think\Controller { public function index() { $this->assign('name','thinkphp'); return $this->fetch('index',[],['__PUBLIC__'=>'/public/']); } }

如果需要全局替换的话,可以直接在配置文件中添加:

'view_replace_str' => [ '__PUBLIC__'=>'/public/', '__ROOT__' => '/', ]

3.在模板文件中输出URL

使用助手函数,例如: {:url('blog/read', 'name=thinkphp')}


4.jQuery使用ajax方法报错

SyntaxError: Unexpected token < in JSON at position 0 at parse (<anonymous>) at jquery-3.4.1.min.js:2 at l (jquery-3.4.1.min.js:2) at XMLHttpRequest.<anonymous> (jquery-3.4.1.min.js:2)

代码:

$.ajax({ type: "GET", url: "{:url('admin/index/article')}", dataType: "json", data: "type="+ this.id, success: function(data){ if (data.status == 1) { alert(data.message); }else{ alert(data.message); } }, error: function(XMLHttpRequest,textStatus,errorThrown){ console.log(XMLHttpRequest); console.log(textStatus); console.log(errorThrown); } });

返回的数据为:

responseText: "<pre>string(3) "all"↵</pre>{"status":1,"message":"返回成功"}"

可见返回数据的确不是正确的json格式数据。

后端代码:

public function article($type="") { if ($type !== "") { dump($type); }else{ echo "hello world!"; } $status = 1; $message = '返回成功'; return ['status'=>$status,'message'=>$message]; }

错误出现在dump()函数,为了测试type参数的存在,之后没有对其进行处理。以至于在后面的调用中返回来不合理的数据,建议后面测试时使用halt()函数,变量调试输出并中断执行。

但使用halt()函数,依然会将数据返回给ajax,且不符合json格式。


5.ajax异步渲染视图

本以为在异步执行过程中也可以直接对视图进行渲染。 郁闷了一下午后,发现是不可行的,ajax貌似只会将数据返回,无法对视图做出操作的。 所以需要将渲染得到的视图进行返回,然后对视图进行处理。

//模板赋值,获取模板渲染后的代码 $this->assign("article_list",$article); $result = $this->fetch("article"); return ["result"=>$result]; //将渲染得到的视图进行输出 $.ajax({ type: "GET", url: "{:url('admin/index/index')}", dataType: "json", data: "type="+ this.id, success: function(data){ $(".article-content").empty().html(data.result); } });

6.DOM结构改变(替换)后jQuery绑定事件失效

在5中重新渲染视图后,事件失效。大概原因应该是,jQuery事件是在DOM结构加载完成时进行绑定的,如果后面的DOM结构发生变化,并不会重新对其进行绑定。

解决方法: 参考:解决jquery中动态新增的元素节点无法触发事件问题的两种方法

解决方法就是,将事件绑定给他的父级或者bofy元素上:

<p id="pLabel">新加一条</p> <ul id="ulLabel"> <li class="liLabel">aaa1</li> <li class="liLabel">aaa2</li> <li class="liLabel">aaa3</li> </ul> <script type="text/javascript"> $("#pLabel").click(function(){ $("#ulLabel").append('<li class="liLabel">aaaQ</li>'); //动态像ul的末尾追加一个新元素 }); </script> $("#ulLabel").on('click','.liLabel',function(){ alert('OK') }); 或者: $("body").on('click','.liLabel',function(){ alert('OK') }); 或者 $(document).on('click','.liLabel',function(){ alert('OK') });

7.对软删除数据进行更新操作

不能使用where子句进行查询后更新,因为软删除字段是无法被正常的查询语句所查询的。 即:

//无效代码 User::where('id', 1)->update(['name' => 'thinkphp']); //正确代码 User::update(['id'=>1,'name'=>'thinkphp']); //或者,第二个数组参数为查询条件 User::update([''name'=>'thinkphp'],[id'=>1]);

8.jQuery ajax中的this指向问题

参考: Jquery 的ajax里边不能识别$(this)

jquery中ajax回调函数使用this

①在jQuery使用ajax后$(this)失效,原因很简单,$(this)指向的是最近调用它的jquery对象, 即$(this)就是表示ajax对象了,解决办法也是很简单,在使用$.ajax({})前将$(this)赋给一个变量后即可在$.ajax({})内使用。

②解决办法是使用bind(this)绑定this到当前事件。

$.ajax({type: 'GET', url: url, data: oData, success:function(){ $(this).prevAll('p').css("text-decoration","line-through"); }.bind(this) });

9.JavaScript中的else if要分开写

报错: Uncaught SyntaxError: Unexpected token '{' 如果写为elseif该判断后的{就会报错如上。


10.PHP反序列化报错

参考: unserialize(): Error at offset出现的原因分析以及解决方法

报错如下: unserialize(): Error at offset 0 of 140 bytes

出现背景,在前端将表单序列化传递给后台后对其进行反序列化解析时报错。 看来网上的解决办法是: php5.5以下

function mb_unserialize($str) { $out = preg_replace('!s:(\d+):"(.*?)";!se', "'s:'.strlen('$2').':\"$2\";'", $str ); return unserialize($out); }

但是由于PHP本身 /e模式的漏洞,php5.5+,已经废弃了这种用法

php5.5+

function mb_unserialize($str) { return preg_replace_callback('#s:(\d+):"(.*?)";#s',function($match){return 's:'.strlen($match[2]).':"'.$match[2].'";';},$str); }

出现的原因: 英文数据中含有中文字符串,所以我们就可以想到编码的问题,serialize()函数对在不同编码下对中文的处理结果是不一样的。

再讲gbk转换成utf8的格式后,每个中文的自己数从2个会增加到3个,所以会导致反序列化的时候判断字符长度出现问题


11.TP5新增数据:数据表[create_time]字段不存在

报错:数据表字段不存在:[create_time] 推测原因:数据库配置中设置了'auto_timestamp' => true,从而导致在向数据库中新增数据时会默认添加create_time、update_time字段的时间戳。

解决办法:除非是,该模块/应用下的数据新增都需要写入这俩个字段,否则不要同意设置该项时间戳自动写入。而是在需要该功能的数据表对应模型中对其进行定义。 protected $autoWriteTimestamp = true; 当然也可以全局配置为自动时间戳写入,而在单个不需要自动写入的模型中关闭: protected $autoWriteTimestamp = false;

最新回复(0)