修复Ajax评论有时页面错位的Bug

11-19 | 夜光 | IT记录

使用了Willin Kan的Ajax评论以后,当有错误提示产生时,有时会出现页面错位的现象,这是因为wordpress输出错误提示有两种方法:

一、第一种是err()函数:
这种不会出现页面错位,我们可以把网站中涉及评论提示的所有代码中的wp_die()函数改为err()函数,但是这显然不太适合。err()函数输出的错误提示源码如下(很干脆,只有文本):

检测到重复评论,您似乎已经提交过这条评论了!

二、第二种是wp_die()函数:
这种会在使用Ajax评论时出现页面错位现象,wp_die()函数输出错误提示源码如下:

<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>WordPress › 错误</title>
<link rel="stylesheet" href="/wp-admin/css/install.css" type="text/css">
<p>检测到重复评论,您似乎已经提交过这条评论了!</p>

三、解决Ajax评论页面错位方法:
因为有时是err()函数输出,有时是wp_die()函数输出,所以我们不可以采用直接取p标签中文本的方法,可以先过滤掉所有非p标签的内容,然后再去掉p标签,最后就只剩下p标签中的文本了。
将comments-ajax.js文件中的如下代码:

$('#error').slideDown().html('<img src="' + pic_no + '" style="vertical-align:middle;" alt=""/> ' + request.responseText);

替换为:

$('#error').slideDown().html('<img src="' + pic_no + '" style="vertical-align:middle;" alt=""/> ' + request.responseText.replace(/<(?!p).*?>(?:.*?<\/.*?>)?/gi,'').replace(/<[^>].*?>/g,''));

这下不会出现页面错位现象了。

本文标签:
本文链接: repair-ajax-comments-bug-sometimes-page-dislocation/
版权所有: 玻璃泉, 转载请注明本文出处。