jsasg/orico-official-website
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases 3 Wiki Activity

格式化

Browse Source
This commit is contained in:
liangjiami
2025-07-17 15:22:56 +08:00
parent d0b4d74b46
commit 4079574575
1 changed files with 38 additions and 38 deletions
Download Patch File Download Diff File Expand all files Collapse all files

76
app/index/view/mobile/topic_nas/help_detail.html
View File

@@ -22,18 +22,18 @@
<div class="headtop">
{eq name=":cookie('think_lang')" value="zh-cn"}
<a href="{:url('/index/topic/nas/index')}">
{else/}
<a>
{/eq}
<img src="__IMAGES__/logo.png" class="logoicoimg">
</a>
<div style="display: flex;">
<img src="__IMAGES__/fenlei.png" class="ssicoimg" id="flico">
<img src="__IMAGES__/sousuo.png" class="ssicoimg" id="ssico" style="margin-right:32px">
</div>
{else/}
<a>
{/eq}
<img src="__IMAGES__/logo.png" class="logoicoimg">
</a>
<div style="display: flex;">
<img src="__IMAGES__/fenlei.png" class="ssicoimg" id="flico">
<img src="__IMAGES__/sousuo.png" class="ssicoimg" id="ssico" style="margin-right:32px">
</div>
</div>
<!-- 文章内容 -->
<div class="ql-container">
<div class="ql-container">
<div id="rendered-content" class="nhlp-app-content ql-editor">
{$article.content|raw|default=''}
</div>
@@ -42,7 +42,8 @@
<div class="nhlpapp-search">
<div class="nhlpappshtop">
<div class="nhlpapp-shdiv">
<input class="nhlp-ipt" id="search-input" placeholder="{:lang_i18n('请输入搜索关键字,如安装赛博云空间,影视库')}" autocomplete="off">
<input class="nhlp-ipt" id="search-input" placeholder="{:lang_i18n('请输入搜索关键字,如安装赛博云空间,影视库')}"
autocomplete="off">
<img src="__IMAGES__/ssapp.png" class="searchimg">
</div>
<span class="closetx">{:lang_i18n('取消')}</span>
@@ -52,7 +53,7 @@
<div class="dropdown" id="dropdown"></div>
</div>
<!-- 分类文章目录 -->
<div class="nhlpapp-pagescate" {:style(['display' => $Request.get.view == 'more' ? 'block' : 'none'])}>
<div class="nhlpapp-pagescate" {:style(['display'=> $Request.get.view == 'more' ? 'block' : 'none'])}>
<div class="nars-hlpdt-ml">
{notempty name="article_categorys"}
<div class="nav-tree">
@@ -60,14 +61,16 @@
<div class="categoryhelp">
<div class="categoryhelp-title">
<div>
<img src="__IMAGES__/nars-jt.png" class="arrow {if condition='$ac.id == $Request.get.cid'}rotate{/if}">
<img src="__IMAGES__/nars-jt.png"
class="arrow {if condition='$ac.id == $Request.get.cid'}rotate{/if}">
</div>
<span>{$ac.name}</span>
</div>
<ul class="sub-list" {if condition='$ac.id == $Request.get.cid'}style="display: block;"{/if}>
<ul class="sub-list" {if condition='$ac.id == $Request.get.cid' }style="display: block;" {/if}>
{volist name="ac.article" id="ar"}
<li>
<a href="{:url('/index/topic/nas/help_detail', ['cid' => $ac.id , 'id' => $ar.id])}" style="padding-top: 6px;">
<a href="{:url('/index/topic/nas/help_detail', ['cid' => $ac.id , 'id' => $ar.id])}"
style="padding-top: 6px;">
{$ar.title}
</a>
</li>
@@ -79,7 +82,7 @@
{/notempty}
</div>
</div>
<!-- 顶部国家选择-->
<!-- 顶部国家选择-->
<div class="top-country">
<div class="mask"></div>
<div class="action-sheet">
@@ -134,10 +137,10 @@
$('.nhlpapp-search').hide();
});
// 顶部国家选择
$('.top-country-toggle').click(function(){
$('.top-country-toggle').click(function () {
$(".mask,.action-sheet").show();
})
$('.top-country .close-icon').click(function(){
$('.top-country .close-icon').click(function () {
$(".mask,.action-sheet").hide();
})
// 搜索
@@ -172,25 +175,22 @@
})
}, 300);
});
// 英文截断
// 处理 #rendered-content 内的内容
$('#rendered-content').html(function(i, html) {
// 英文截断处理
$('#rendered-content').html(function (i, html) {
// 1. 先保护真正的空行（只包含&nbsp;的标签）
html = html.replace(/<(p|h[1-6])>(<strong>)?(&nbsp;| )*(<\/strong>)?<\/\1>/g, function(match) {
// 统一空行格式为 <p>&nbsp;</p> 或 <h2>&nbsp;</h2> 形式
return match.replace(/(<p>|<h[1-6]>)\s*(<strong>)?\s*(&nbsp;| )*\s*(<\/strong>)?\s*(<\/p>|<\/h[1-6]>)/,
function(m) {
var tag = m.match(/<(p|h[1-6])>/)[1];
return '<' + tag + '>&nbsp;</' + tag + '>';
});
html = html.replace(/<(p|h[1-6])>(<strong>)?(&nbsp;| )*(<\/strong>)?<\/\1>/g, function (match) {
// 统一空行格式为 <p>&nbsp;</p> 或 <h2>&nbsp;</h2> 形式
return match.replace(/(<p>|<h[1-6]>)\s*(<strong>)?\s*(&nbsp;| )*\s*(<\/strong>)?\s*(<\/p>|<\/h[1-6]>)/,
function (m) {
var tag = m.match(/<(p|h[1-6])>/)[1];
return '<' + tag + '>&nbsp;</' + tag + '>';
});
});
// 2. 替换其他&nbsp;为普通空格（保留单词间的空格）
html = html.replace(/&nbsp;(?=\w)/g, ' ');
return html;
});
// 添加CSS样式确保英文单词完整换行
$('#rendered-content').css({
'word-wrap': 'break-word',
@@ -198,17 +198,17 @@
'word-break': 'normal',
'white-space': 'normal'
});
// 优化英文单词间的空格处理
$('#rendered-content').find('p, h1, h2, h3, h4, h5, h6').each(function() {
$('#rendered-content').find('p, h1, h2, h3, h4, h5, h6').each(function () {
var $el = $(this);
// 只处理非空行
if ($el.html().trim() !== '&nbsp;') {
var html = $el.html()
.replace(/([a-zA-Z])(&nbsp;| )+([a-zA-Z])/g, '$1 $3') // 单词间保留一个空格
.replace(/(\d)(&nbsp;| )+([a-zA-Z])/g, '$1 $3') // 数字和单词间
.replace(/([a-zA-Z])(&nbsp;| )+(\d)/g, '$1 $3'); // 单词和数字间
$el.html(html);
var html = $el.html()
.replace(/([a-zA-Z])(&nbsp;| )+([a-zA-Z])/g, '$1 $3') // 单词间保留一个空格
.replace(/(\d)(&nbsp;| )+([a-zA-Z])/g, '$1 $3') // 数字和单词间
.replace(/([a-zA-Z])(&nbsp;| )+(\d)/g, '$1 $3'); // 单词和数字间
$el.html(html);
}
});
});