826 Star 2.8K Fork 1.3K

Discuz / DiscuzX

Merged
!474 [Lightweight PR]: 修复 帖子列表页点击长条形下一页按钮时加载出的帖子后方图标样式异常的问题

N/A Discuz:master

popcorner Created on: 2020-05-04 02:52

可能是我提交过的内容最简单的PR :joy: (但是确实是有必要的)
在处理模板问题的时候,发现在点击页面下方最长的下一页按钮,通过ajax加载更多列表内容的时候,加载进来的每一行帖子标题后方的图标之间的间距全都是错的。准确的说,是全挤一起了,非常难看。
经仔细观察,这个长条形ajax加载列表的功能的实现方式非常的简单粗暴,加载的就是正常的下一页的帖子列表页,并用正则表达式从中匹配出每一行的帖子相关信息,然后填充到现有页面的帖子列表后面。

问题就出在这个js上,按理说加载完全相同的内容,样式是不应该有区别的,但事实上这个js在做正则匹配之前,把HTML里所有的换行符全给删了(我猜可能是当初写正则的人因为正则匹配不上换行符而去掉的)。虽说换行符本身在HTML里没什么意义也显示不出换行,但实际上在inline、inline-block等状态下,换行符在渲染时会被视为空白字符,并会在页面上渲染出一个空格,删除换行将会导致渲染出来的行为不再符合原本设计的预期。
虽说依赖这一特性做样式并不是一个好主意,但改变预期行为就更不好了。
因此本PR对此进行了修改,将原有的删除换行符的行为,更改为把换行符替换为普通空格。这样的替换可以在不改变原有正则的前提下,保证浏览器的渲染行为不变(都是在页面渲染出最多一个的空格,因此即便使用CRLF的discuz的换行会被替换为2个空格,行为也不会有区别)。

0 comments, 1 participants

Show action logs Hide action logs
oldhuhu merged Pull Request 2020-06-02 12:23
oldhuhu check passed 2020-06-02 12:23
popcorner updated description 2020-05-04 03:12
popcorner assigned reviewer 湖中沉 2020-05-04 02:52
popcorner assigned reviewer oldhuhu 2020-05-04 02:52
popcorner assigned reviewer monkeye 2020-05-04 02:52
popcorner assigned reviewer Discuz! 2020-05-04 02:52
popcorner assigned reviewer LooTan 2020-05-04 02:52
popcorner assigned reviewer comsenz-service 2020-05-04 02:52
popcorner assigned reviewer DiscuzX 2020-05-04 02:52
PHP
1
https://gitee.com/Discuz/DiscuzX.git
git@gitee.com:Discuz/DiscuzX.git
Discuz
DiscuzX
DiscuzX

Search

102255 3a0e046c 1850385 102255 7aaa926c 1850385