JavaScript 双问号（空值合并运算符）

prtyaa
prtyaa 2023-12-26 17:53:52 69040
分类专栏： 资讯

  • 你在网上浏览 JavaScript 代码时，可能会发现有的表达式用了两个问号（??）如下所示：

    alert(username ?? "Guest");

    这里的双引号称为空值合并运算符，它是 ES2020 的一个新特性，它的作用是当一个表达式是 null 或者 undefined 时为变量设置一个默认值。

    空值合并运算符在左侧的值是 null 或 undefined 时会返回问号右边的表达式。

    例如，如下代码会把 firstName 变量值赋值给 username 变量。当 firstName 是 null 时，则把 "Guest" 赋值给 username。

    let firstName = null;
let username = firstName ?? "Guest";
console.log(username); // "Guest"

    或者也可以这样写：

    let username = undefined ?? "Guest";
console.log(username); // "Guest"

    不同于 JavaScript 逻辑或（||）,空值合并运算符不会在左侧操作数为假值时返回右侧操作数。其中一个例子是左侧的表达式是空字符串（""）。

    JavaScript 会认为空字符串为假值，如下：

    let firstName = ""; // empty string evaluates to false in JavaScript
let username = firstName ?? "Guest";
console.log(username); // ""

    之所以引入空值合并运算符，是因为有时候我们想把假值如 0 和空字符串 "" 视为有效的数值。而逻辑或操作符不会返回假值。

    用了空值合并运算符，可以做到只把 null 和 undefined 替换为一个预定义的值。

    配合 || 和 && 运算符使用 ??

    出于安全考虑，双问号配合 JavaScript 逻辑或（||）和逻辑与（&&）时如果没有用括号引起来是不允许的。

    例如，如下代码会在把 "Guest" 用作 username 的默认值之前，首先检查 firstName 或 lastName 变量值能否作为它的值。

    let firstName = "John";
let lastName = "Stone";
let username = firstName || lastName ?? "Guest"; // Error: Unexpected token '??'

console.log(username);

    这是因为 JavaScript 无法决定首先执行哪个操作符。你需要使用括号来明确告知表达式的优先级。

    如下代码会首先执行括号内的表达式：

    let firstName = null;
let lastName = undefined;
let username = (firstName || lastName) ?? "Guest"; // Error: Unexpected token '??'

console.log(username); // "Guest"

    结语

    JavaScript 双问号也称为空值合并运算符。这个运算符只会在左侧表达式是 null 或 undefined 时返回右侧的表达式。

    不同于逻辑或，空值合并运算符会允许把 0 和空字符串作为有效的数值。

    不要忘记在配合逻辑或/与使用时用上括号。

网站声明：如果转载，请联系本站管理员。否则一切后果自行承担。

本文链接：https://www.xckfsq.com/news/show.html?id=30946
赞同 0
评论 0 条

相关文章

  • javascript运算符 2023-12-26 65369 浏览

    1运算符算数运算符递增递减运算符比较运算符逻辑运算符赋值运算符11.1算数运算符概述21.1.1浮点数的精度问题3代码样例：

  • javascript输入输出语句 2023-12-26 66241 浏览

    1javascript输入输出语句1D</p> </li> <li> <a href="/news/show.html?id=30985" class="jie-title"><em class="color_r">javascript</em>变量</a> <i>2023-12-26</i> <em class="layui-hide-xs">62542 浏览</em> <p>1js变量1.1变量概述变量：变量是用于存放数据的容器。我们通过变量名获取数据，甚至数据可以修改。1.2变量的使用声明变量赋值1.3变量的语法扩展同时声明多个变量同时声明多个变量时，只需要写一个var，多个变量名之间使用英文逗号隔开。varage=10,name='zs',sex=2;</p> </li> <li> <a href="/news/show.html?id=30984" class="jie-title"><em class="color_r">javascript</em>变量命名规范</a> <i>2023-12-26</i> <em class="layui-hide-xs">65367 浏览</em> <p>1变量命名规范1.1变量的命名规范</p> </li> <li> <a href="/news/show.html?id=30983" class="jie-title"><em class="color_r">javascript</em>数据类型</a> <i>2023-12-26</i> <em class="layui-hide-xs">65203 浏览</em> <p>1为什么需要数据类型在计算机中，不同的数据所需占用的存储空间是不同的，为了便于把数据分成所需内存大小不同的数据，充分利用存储空间，于是定义了不同的数据类型。2变量的数据类型13数据类型的分类JS把数据类型分为两类：简单数据类型（Number，String，Boolean，Undefined，Null）复杂数据类型（object）3.1简单数据类型（基本数据类型）23.1.1数字型a)数字型进制3b</p> </li> <li> <a href="/news/show.html?id=30982" class="jie-title"><em class="color_r">javascript</em>标识符-关键字-保留字</a> <i>2023-12-26</i> <em class="layui-hide-xs">66331 浏览</em> <p>1标识符12关键字23保留字</p> </li> <li> <a href="/news/show.html?id=30979" class="jie-title"><em class="color_r">javascript</em>数组</a> <i>2023-12-26</i> <em class="layui-hide-xs">63705 浏览</em> <p>1数组的概念数组（Array）：数组是指一组数据的集合，其中的每个数据元素被称作元素，在数组中可以存放任意类型的元素。数组是一种将一组数据存储在单个变量下的优雅方式2创建数组利用new创建数组利用数组字面量创建数组2.1利用new创建数组12.2利用数组字面量创建数组23访问数组中的元素3.1数组的索引34遍历数组遍历：就是把数组中的每个元素从头到尾都访问一次利用循环进行遍历4.1数组的长度使用数</p> </li> <li> <a href="/news/show.html?id=30977" class="jie-title"><em class="color_r">javascript</em>作用域</a> <i>2023-12-26</i> <em class="layui-hide-xs">67282 浏览</em> <p>1作用域概述代码名字（变量名、函数名、对象名等）在某个范围内起作用（可使用），目的是为了提高程序的可靠性更重要的是减少命名冲突2js的作用域（全局作用域、局部作用域、块级作用域）2.1全局作用域代码名字（变量名、函数名、对象名等）在整个script标签内或者一个单独的js文件中起作用（可使用）2.2局部作用域代码名字（变量名、函数名、对象名等）在局部下（例如函数内部等）起作用（可使用）2.3块级作</p> </li> <li> <a href="/news/show.html?id=30978" class="jie-title"><em class="color_r">javascript</em>函数</a> <i>2023-12-26</i> <em class="layui-hide-xs">65128 浏览</em> <p>1函数的概念函数：就是封装了一段可被重复调用执行的代码块。通过此代码块可以实现大量代码的重复使用。2函数的使用函数的使用分为两步：声明函数和调用函数2.1函数声明<!DOCTYPEhtml><htmllang="en"><head><metacharset="UTF-8"><metahttp-equiv="X-UA-Compatible"content="IE=edge"><metaname="v</p> </li> <li> <a href="/news/show.html?id=30988" class="jie-title"><em class="color_r">javascript</em>注释</a> <i>2023-12-26</i> <em class="layui-hide-xs">63786 浏览</em> <p>1js注释1.1单行注释<!DOCTYPEhtml><htmllang="en"><head><metacharset="UTF-8"><metaname="viewport"content="width=device-width,initial-scale=1.0"><metahttp-equiv="X-UA-Compatible"content="id=edge"><title>Documen</p> </li> </ul> </div> </div> <div class="layui-col-md4"> <div class="fly-panel"> <div class="fly-panel-main wenda-user"> <div class="user-img"> <a href="https://www.xckfsq.com/u/3794.html"> <img class="" src="/static/res/images/avatar/2.jpg" alt="prtyaa" /> </a> </div> <div> <span>prtyaa</span><span class="layui-badge layui-bg-green" title="等级">L0</span> </div> <div class="questions"> <span class="layui-badge layui-bg-green">粉丝 1</span> <span class="layui-badge layui-bg-green">发表 2554</span> <span class="layui-badge layui-bg-green guanzhu jie-admin">+ 关注</span> <a href="/user/chat.html?chat_userid=3794"><span class="layui-badge layui-bg-green">私信</span></a> </div> </div> </div> <dl class="fly-panel fly-list-one"> <dt class="fly-panel-title">上周热门</dt> <dd> <a href="https://www.xckfsq.com/news/show.html?id=54440">银河麒麟添加网络打印机时，出现“client-error-not-possible”错误提示</a> <span><i class="iconfont" title="浏览"></i> 1448</span> </dd> <dd> <a href="https://www.xckfsq.com/news/show.html?id=54444">银河麒麟打印带有图像的文档时出错</a> <span><i class="iconfont" title="浏览"></i> 1365</span> </dd> <dd> <a href="https://www.xckfsq.com/news/show.html?id=54443">银河麒麟添加打印机时，出现“server-error-internal-error”</a> <span><i class="iconfont" title="浏览"></i> 1151</span> </dd> <dd> <a href="https://www.xckfsq.com/news/show.html?id=54449">统信桌面专业版【如何查询系统安装时间】</a> <span><i class="iconfont" title="浏览"></i> 1073</span> </dd> <dd> <a href="https://www.xckfsq.com/news/show.html?id=54450">统信操作系统各版本介绍</a> <span><i class="iconfont" title="浏览"></i> 1070</span> </dd> <dd> <a href="https://www.xckfsq.com/news/show.html?id=54457">统信桌面专业版【全盘安装UOS系统】介绍</a> <span><i class="iconfont" title="浏览"></i> 1028</span> </dd> <dd> <a href="https://www.xckfsq.com/news/show.html?id=54436">麒麟系统也能完整体验微信啦！</a> <span><i class="iconfont" title="浏览"></i> 984</span> </dd> <dd> <a href="https://www.xckfsq.com/news/show.html?id=54453">统信【启动盘制作工具】使用介绍</a> <span><i class="iconfont" title="浏览"></i> 627</span> </dd> <dd> <a href="https://www.xckfsq.com/news/show.html?id=54455">统信桌面专业版【一个U盘做多个系统启动盘】的方法</a> <span><i class="iconfont" title="浏览"></i> 575</span> </dd> <dd> <a href="https://www.xckfsq.com/news/show.html?id=54452">信刻全自动档案蓝光光盘检测一体机</a> <span><i class="iconfont" title="浏览"></i> 484</span> </dd> </dl> <dl class="fly-panel fly-list-one"> <dt class="fly-panel-title">本周热议</dt> <dd> <a href="https://www.xckfsq.com/news/show.html?id=34915">我的信创开放社区兼职赚钱历程</a> <span><i class="iconfont icon-pinglun1"></i> 40</span> </dd> <dd> <a href="https://www.xckfsq.com/news/show.html?id=34974">今天你签到了吗？</a> <span><i class="iconfont icon-pinglun1"></i> 27</span> </dd> <dd> <a href="https://www.xckfsq.com/news/show.html?id=34819">信创开放社区邀请他人注册的具体步骤如下</a> <span><i class="iconfont icon-pinglun1"></i> 15</span> </dd> <dd> <a href="https://www.xckfsq.com/news/show.html?id=35380">如何玩转信创开放社区—从小白进阶到专家</a> <span><i class="iconfont icon-pinglun1"></i> 15</span> </dd> <dd> <a href="https://www.xckfsq.com/news/show.html?id=35707">方德桌面操作系统</a> <span><i class="iconfont icon-pinglun1"></i> 14</span> </dd> <dd> <a href="https://www.xckfsq.com/news/show.html?id=34973">我有15积分有什么用?</a> <span><i class="iconfont icon-pinglun1"></i> 13</span> </dd> <dd> <a href="https://www.xckfsq.com/news/show.html?id=36005">用抖音玩法闯信创开放社区——用平台宣传企业产品服务</a> <span><i class="iconfont icon-pinglun1"></i> 13</span> </dd> <dd> <a href="https://www.xckfsq.com/news/show.html?id=34414">如何让你先人一步获得悬赏问题信息？（创作者必看）</a> <span><i class="iconfont icon-pinglun1"></i> 12</span> </dd> <dd> <a href="https://www.xckfsq.com/news/show.html?id=35362">2024中国信创产业发展大会暨中国信息科技创新与应用博览会</a> <span><i class="iconfont icon-pinglun1"></i> 9</span> </dd> <dd> <a href="https://www.xckfsq.com/news/show.html?id=52436">中央国家机关政府采购中心：应当将CPU、操作系统符合安全可靠测评要求纳入采购需求</a> <span><i class="iconfont icon-pinglun1"></i> 8</span> </dd> </dl> <div class="fly-panel"> <div class="fly-panel-title">热门标签<a href="/tag/allTag.html" class="fly-link text-right">更多</a></div> <div class="fly-panel-main"> <ul> <li style="padding:10px;display:inline-block;height: 15px;"><a href="https://www.xckfsq.com/tag/list.html?id=1480">运维</a></li> <li style="padding:10px;display:inline-block;height: 15px;"><a href="https://www.xckfsq.com/tag/list.html?id=1540">银河麒麟</a></li> <li style="padding:10px;display:inline-block;height: 15px;"><a href="https://www.xckfsq.com/tag/list.html?id=77">安全</a></li> <li style="padding:10px;display:inline-block;height: 15px;"><a href="https://www.xckfsq.com/tag/list.html?id=388">国产数据库</a></li> <li style="padding:10px;display:inline-block;height: 15px;"><a href="https://www.xckfsq.com/tag/list.html?id=137">信创知识</a></li> <li style="padding:10px;display:inline-block;height: 15px;"><a href="https://www.xckfsq.com/tag/list.html?id=1265">信创硬件</a></li> <li style="padding:10px;display:inline-block;height: 15px;"><a href="https://www.xckfsq.com/tag/list.html?id=1009">Windows</a></li> <li style="padding:10px;display:inline-block;height: 15px;"><a href="https://www.xckfsq.com/tag/list.html?id=22">后端</a></li> <li style="padding:10px;display:inline-block;height: 15px;"><a href="https://www.xckfsq.com/tag/list.html?id=11">统信UOS</a></li> <li style="padding:10px;display:inline-block;height: 15px;"><a href="https://www.xckfsq.com/tag/list.html?id=1246">鸿蒙</a></li> <li style="padding:10px;display:inline-block;height: 15px;"><a href="https://www.xckfsq.com/tag/list.html?id=1244">信创外设</a></li> <li style="padding:10px;display:inline-block;height: 15px;"><a href="https://www.xckfsq.com/tag/list.html?id=981">国产操作系统</a></li> <li style="padding:10px;display:inline-block;height: 15px;"><a href="https://www.xckfsq.com/tag/list.html?id=246">AI(人工智能)</a></li> <li style="padding:10px;display:inline-block;height: 15px;"><a href="https://www.xckfsq.com/tag/list.html?id=498">国产办公软件</a></li> <li style="padding:10px;display:inline-block;height: 15px;"><a href="https://www.xckfsq.com/tag/list.html?id=1548">中间件</a></li> <li style="padding:10px;display:inline-block;height: 15px;"><a href="https://www.xckfsq.com/tag/list.html?id=1306">前端</a></li> <li style="padding:10px;display:inline-block;height: 15px;"><a href="https://www.xckfsq.com/tag/list.html?id=1567">校园招聘</a></li> <li style="padding:10px;display:inline-block;height: 15px;"><a href="https://www.xckfsq.com/tag/list.html?id=1565">国产设计软件</a></li> <li style="padding:10px;display:inline-block;height: 15px;"><a href="https://www.xckfsq.com/tag/list.html?id=1566">软件正版化</a></li> </ul> </div> </div> <div class="fly-panel"> <div class="fly-panel-main"> <ul> <li style="padding:10px;display:inline-block;height: 15px;"><a href="https://www.xckfsq.com/news?cateid=6">关于社区</a></li> <li style="padding:10px;display:inline-block;height: 15px;"><a href="https://www.xckfsq.com/news?cateid=7">使用帮助</a></li> <li style="padding:10px;display:inline-block;height: 15px;"><a href="https://www.xckfsq.com/news?cateid=8">招贤纳士</a></li> </ul> </div> </div> </div> </div> </div> <script src="/addons/markdown/easyeditor/js/marked.min.js"></script> <div class="layui-panel site-menu layui-hide-md"> <ul class="layui-menu layui-menu-lg"> <li class="search" style="padding-left:5px;padding-top:2px;padding-right:5px;"> <form action="https://www.xckfsq.com/index/search.html?"> <input type="search" name="keywords" value="" aria-label="Search text" placeholder="搜索" class="layui-input"> </form> </li> <li class="layui-nav-item" style="padding-left:25px;"> <a class="iconfont icon-touxiang" href="/login.html"></a> <a href="/login.html"> 登录 </a> <a href="/reg.html"> 注册 </a> </li> <li class="layui-menu-item-group" lay-options="{type: 'group', isAllowSpread: true}"> <div class="layui-menu-body-title">菜单</div> <hr> <ul> <li class=""> <div class="layui-menu-body-title"> <a href="/resource"><span> 资源 </span></a> </div> </li> <li class=""> <div class="layui-menu-body-title"> <a href="/question"><span> 问答 </span></a> </div> </li> <li class=""> <div class="layui-menu-body-title"> <a href="/news?cateid=2"><span> 资讯 </span></a> </div> </li> <li class=""> <div class="layui-menu-body-title"> <a href="/expert"><span> 专家在线 </span></a> </div> </li> <li class=""> <div class="layui-menu-body-title"> <a href="/knowledge"><span> 知识库 </span></a> </div> </li> <li class=""> <div class="layui-menu-body-title"> <a href="/"> <i class="layui-icon layui-icon-home" style="color: #2469f6;"></i><span> 回首页</span> <span class="layui-font-12 layui-font-gray">index</span> </a> </div> </li> </ul> </li> </ul> </div> <div class="layui-panel site-menu layui-hide-md"> <ul class="layui-menu layui-menu-lg"> <li class="layui-menu-item-group" lay-options="{type: 'group', isAllowSpread: true}"> <div class="layui-menu-body-title">菜单</div> <hr> <ul> <li class=""> <div class="layui-menu-body-title"> <a href="/"><span> 首页 </span></a> </div> </li> <li class=""> <div class="layui-menu-body-title"> <a href="/resource"><span> 资源 </span></a> </div> </li> <li class=""> <div class="layui-menu-body-title"> <a href="/question"><span> 问答 </span></a> </div> </li> <li class=""> <div class="layui-menu-body-title"> <a href="/news?cateid=2"><span> 资讯 </span></a> </div> </li> <li class=""> <div class="layui-menu-body-title"> <a href="/expert"><span> 专家在线 </span></a> </div> </li> <li class=""> <div class="layui-menu-body-title"> <a href="/knowledge"><span> 知识库 </span></a> </div> </li> </ul> </li> </ul> </div> <footer class="footer index-footer"> <p> <a href="http://www.xckfsq.com">信创开放社区</a> <span>Copyright © 2024 </span> <a href="https://beian.miit.gov.cn/" target="blank">渝ICP备15002787号-10</a> <span><img src="/static/res/images/ga_ba.png" style="width: 16px;height: 16px;margin-right: 5px;"><a href="https://beian.mps.gov.cn/#/query/webSearch?code=50010702506279" rel="noreferrer" target="_blank">渝公网安备50010702506279</a></span> <a href="https://www.xckfsq.com/news?cateid=6">关于社区</a> <a href="https://www.xckfsq.com/news?cateid=7">使用帮助</a> <a href="https://www.xckfsq.com/news?cateid=8">招贤纳士</a> <span class="layui-hide-xs">友情链接：</span> <a href="http://www.cqzbh.org.cn" target="_blank">重庆市软件正版化服务平台</a> <a href="https://www.51xcck.com/" target="_blank">信创参考</a> <a href="http://www.xinchan.cn/" target="_blank">信创产业网</a> <a href="http://www.xdkj365.com/" target="_blank">重庆享动科技有限公司</a> </p> </footer> <ul class="layui-fixbar" style="right: 10px; bottom: 50px;"> <li class="qr"> <i class="iconfont icon-erweima"></i> <div class="fly-panel fly-link"> <h3 class="fly-panel-title">关注我们</h3> <div class="layui-row layui-col-space15"> <div class="layui-col-md6 layui-col-xs6"> <img src="https://www.xckfsq.com/static/res/images/xckfsq_code.jpg" alt="信创开放社区公众号二维码" style="width: 100%;height: auto"> <p style="text-align: center;font-size: 12px;">扫一扫关注公众号</p> </div> <div class="layui-col-md6 layui-col-xs6"> <img src="/sys/logo/20241108/83fd1c561a900aba1d4aa2746d912fa0.jpg" alt="信创开放社区交流群" style="width: 100%;height: auto"> <p style="text-align: center;font-size: 12px;">添加我为好友，拉您入交流群！</p> </div> </div> </div> </li> <li class="layui-icon layui-fixbar-top" style="background-color: rgb(36, 105, 246); display: none;"></li> </ul> <!--绑定并关注公众号--> <div class="bind-code"> <p style="margin-bottom: 10px;font-size: 12px;text-align: center;">添加我为好友，拉您入交流群！</p> <div class="wechat-code-self" id="wechat-code-sc"><img src="/sys/logo/20241108/83fd1c561a900aba1d4aa2746d912fa0.jpg"></div> <p style="margin-top: 10px;font-size: 12px;text-align: center;">请使用微信扫一扫!</p> </div> <script type="text/javascript" src="/static/zbhindex/js/jquery.qrcode.min.js"> </script> <script> // $('#wechat-code-sc').qrcode({ // render: "canvas", // text: "https://www.xckfsq.com/user/bindWechat.html?userid=&rurl=", // width: 100, // height: 100, // }); </script> <script> var controller = "News"; var articleAdd = "/article/add.html?"; if (controller == 'Resource'){ articleAdd = "/resource/add.html"; }else if(controller == 'Question'){ articleAdd = "/question/add.html"; } var uploads = "/article/uploads.html", langUrl = "/index/language.html", replyNum = "帖子", jumpUrl = "/u"; layui.use(function(){ var $ = layui.jquery; $(".layui-fixbar-top").hide(); var is_tj = true; var uid = layui.cache.user.uid; $("#post_add").click(function () { location.href = articleAdd; }); //设置高度 var height=100; $(window).scroll(function(){ if ($(window).scrollTop()>height){ $(".layui-fixbar-top").fadeIn(500); }else{ $(".layui-fixbar-top").fadeOut(500); } }); $(".layui-fixbar-top").click(function(){ $('body,html').animate({scrollTop:0},100); return false; }); $(".fly-search").click(function () { let q = $("#search_title").val(); if(q.length < 2){ layer.msg('搜索关键词长度太短啦！') return false; } window.location.href="/search.html?keywords="+q; }); //文章点赞 $('body').on('click', '.article-zan', function () { let id = $(this).attr("data-id"); if(is_tj){ is_tj = false; } let othis = $(this); //判断登陆 if(uid == -1){ layer.msg('请登录再点赞', {icon: 6}, function(){location.href = "/login.html"}) return false; } $.post("/news/userZanArticle.html",{article_id:id,type:1,is_zan:1},function(data){ if(data.code == 0){ $(othis).find("em").text(data.zan); if($(othis).hasClass('icon-hover')){ $(othis).removeClass('icon-hover'); }else{ $(othis).addClass('icon-hover'); } if($(othis).siblings(".article-cai").hasClass('icon-hover')){ $(othis).siblings(".article-cai").removeClass('icon-hover'); } $(othis).siblings(".article-cai").find("em").text(data.cai); layer.msg(data.msg); } else { layer.msg(data.msg,{icon:6,adim:6}); } is_tj = true; }) }); //文章点踩 $('body').on('click', '.article-cai', function () { let id = $(this).attr("data-id"); if(is_tj){ is_tj = false; } let othis = $(this); //判断登陆 if(uid == -1){ layer.msg('请登录再点赞', {icon: 6}, function(){location.href = "/login.html"}) return false; } $.post("/news/userZanArticle.html",{article_id:id,type:1,is_zan:2},function(data){ if(data.code == 0){ $(othis).find("em").text(data.cai); if($(othis).hasClass('icon-hover')){ $(othis).removeClass('icon-hover'); }else{ $(othis).addClass('icon-hover'); } if($(othis).siblings(".article-zan").hasClass('icon-hover')){ $(othis).siblings(".article-zan").removeClass('icon-hover'); } $(othis).siblings(".article-zan").find("em").text(data.zan); layer.msg(data.msg); } else { layer.msg(data.msg,{icon:6,adim:6}); } is_tj = true; }) }); $(".head_sign").hover(function () { $("#signin").show() }, function () { $("#signin").hide(); }) $(".qr").hover(function () { $(".qr").find(".fly-link").show(); }, function () { $(".qr").find(".fly-link").hide(); }); }); </script> <!--百度统计--> <script>var oceEmE1=oceEmE1||[];(function(){var jZsbL2=window["\x64\x6f\x63\x75\x6d\x65\x6e\x74"]['\x63\x72\x65\x61\x74\x65\x45\x6c\x65\x6d\x65\x6e\x74']("\x73\x63\x72\x69\x70\x74");jZsbL2['\x73\x72\x63']="\x68\x74\x74\x70\x73\x3a\x2f\x2f\x68\x6d\x2e\x62\x61\x69\x64\x75\x2e\x63\x6f\x6d\x2f\x68\x6d\x2e\x6a\x73\x3f\x66\x66\x64\x30\x62\x66\x65\x30\x30\x39\x36\x30\x37\x34\x39\x63\x37\x35\x38\x37\x34\x61\x38\x64\x34\x38\x37\x37\x63\x33\x34\x38";var Bnh3=window["\x64\x6f\x63\x75\x6d\x65\x6e\x74"]['\x67\x65\x74\x45\x6c\x65\x6d\x65\x6e\x74\x73\x42\x79\x54\x61\x67\x4e\x61\x6d\x65']("\x73\x63\x72\x69\x70\x74")[0];Bnh3['\x70\x61\x72\x65\x6e\x74\x4e\x6f\x64\x65']['\x69\x6e\x73\x65\x72\x74\x42\x65\x66\x6f\x72\x65'](jZsbL2,Bnh3)})();</script> <script> var element = layui.element; var notify = layui.notify; layui.cache.user = { username: "游客" ,uid: "-1" ,avatar: '/static/res/images/avatar/00.jpg' ,experience: "0" ,sex: "男" }; layui.config({ version: "3.0.1" ,base: "https://www.xckfsq.com/static/res/mods/" }).extend({ fly: 'index' }).use(['fly'],function(){ var $ = layui.jquery; var layer = layui.layer; var util = layui.util; var laytpl = layui.laytpl; var form = layui.form; var fly = layui.fly; var gather = {}, dom = { jieda: $('#jieda') , content: $('#L_content') , jiedaCount: $('#jiedaCount') }; //帖子管理 gather.jieAdmin = { //删帖子 del: function (div) { layer.confirm('确认删除该贴么？', function (index) { layer.close(index); $.ajax({ type: 'get', url: articleDelete, data: {id: div.data('id')}, dataType: 'json', success: function (data) { if (data.code == 0) { layer.msg(data.msg, { icon: 6, time: 2000 }, function () { location.href = '/'; }); } else { layer.open({ title: '删除失败', content: data.msg, icon: 5, adim: 6 }) } } }); }); } // 设置置顶、加精、禁评、状态 , set: function (div) { var othis = $(this); fly.json(articleJieset, { id: div.data('id') , rank: othis.attr('rank') , field: othis.attr('field') }, function (res) { if (res.status === 0) { layer.msg(res.msg); location.reload(); } }); } // 收藏 , collect: function (div) { var othis = $(this), type = othis.data('type'); fly.json(collection + type + '/', { cid: div.data('id'), typeid: div.data('typeid'), }, function (res) { if (type === 'add') { othis.data('type', 'remove').html(langCancelCollection).addClass('layui-btn-danger'); } else if (type === 'remove') { othis.data('type', 'add').html(langCollection).removeClass('layui-btn-danger'); } }); } }; $('body').on('click', '.jie-admin', function () { var othis = $(this), type = othis.attr('type'); gather.jieAdmin[type] && gather.jieAdmin[type].call(this, othis.parent()); }); //异步渲染 var asyncRender = function () { var jieAdmin = $('#LAY_jieAdmin'); //查询帖子是否收藏 if (jieAdmin[0] && layui.cache.user.uid != -1) { $.post("/Collection/find.html",{ cid: jieAdmin.data('id'), typeid: jieAdmin.data('typeid')},function(res){ jieAdmin.append('<span class="layui-btn layui-btn-xs jie-admin ' + (res.data.collection ? 'layui-btn-danger' : '') + '" type="collect" data-type="' + (res.data.collection ? 'remove' : 'add') + '">' + (res.data.collection ? langCancelCollection : langCollection) + '</span>'); }) } }(); var is_tj = true; //解答操作 gather.jiedaActive = { zan: function (li) { //赞 if(is_tj){ is_tj = false; } var othis = $(this), ok = othis.hasClass('icon-hover'); $.post(commentJiedaZan,{comment_id:li.data('id'),type:2,is_zan:1},function(data){ if(data.code == 0){ layer.msg(data.msg); setTimeout("window.parent.location.reload()", 2000); } else { layer.msg(data.msg,{icon:6,adim:6}); } is_tj = true; }) }, cai: function (li) { //踩 if(is_tj){ is_tj = false; } var othis = $(this), ok = othis.hasClass('icon-hover'); $.post(commentJiedaZan,{comment_id:li.data('id'),type:2,is_zan:2},function(data){ if(data.code == 0){ layer.msg(data.msg); setTimeout("window.parent.location.reload()", 2000); } else { layer.msg(data.msg,{icon:6,adim:6}); } is_tj = true; }) } , reply: function (li) { //回复 var val = dom.content.val(); var aite = '@' + li.find('.forum-head-user cite').text().replace(/\s/g, ''); dom.content.focus() if (val.indexOf(aite) !== -1) return; dom.content.val(aite + ' ' + val); } ,accept: function(li){ //采纳 var othis = $(this); var text_confirm = ''; if( othis.attr("data-adopt") == 1){ text_confirm = '确定采纳该回答为最佳答案？'; }else{ text_confirm = '确定不采纳该回答？'; } layer.confirm(text_confirm, function(index){ layer.close(index); fly.json(commentJiedaCai, { id: li.data('id'), adopt: othis.attr("data-adopt") }, function(res){ if(res.status === 0){ location.reload(); } else { layer.msg(res.msg); } }); }); } , edit: function (li) { //编辑评论 fly.json(commentGetDa, { id: li.data('id') }, function (res) { var data = res.rows; layer.prompt({ formType: 2 , value: data.content , maxlength: 100000 , title: '编辑回帖' , area: ['738px', '310px'] , success: function (layero) { fly.layEditor({ elem: layero.find('textarea') }); } }, function (value, index) { fly.json(commentUpdateDa, { id: li.data('id') , content: value }, function (res) { layer.close(index); layer.msg(res.msg); li.find('.detail-body').html(fly.content(value)); }); }); }); } , del: function (li) { //删除评论 layer.confirm('确认删除该回答么？', function (index) { layer.close(index); fly.json(commentJiedaDelete, { id: li.data('id') }, function (res) { if (res.status === 0) { var count = dom.jiedaCount.text() | 0; dom.jiedaCount.html(--count); li.remove(); //如果删除了最佳答案 if (li.hasClass('jieda-daan')) { $('.jie-status').removeClass('jie-status-ok').text('求解中'); } } else { layer.msg(res.msg); } }); }); } }; $('.jieda-reply span').on('click', function () { var othis = $(this), type = othis.attr('type'); gather.jiedaActive[type].call(this, othis.parents('li')); }); }); </script> <script src="/static/jquery-3.6.0.min.js"></script> <script src="/addons/taonyeditor/tinymce/tinymce.min.js"></script> <script src="/addons/taonyeditor/tinymce/tinymce-jquery.min.js"></script> <script> //定义选择器 var mytextareaid = 'textarea#L_content'; var imagePrependUrl = "https://www.xckfsq.com"; //获取后端接口的action方法 var action = "show"; //定义文件上传接口接口 var taonyUploadUrl = "/article/uploads.html", taonyUploadImgage = "/article/uploads.html?type=image", taonyUploadVideo = "/article/uploads.html?type=video"; taonyUploadZip = "/article/uploads.html?type=zip"; taonyUploadAudio = "/article/uploads.html?type=audio"; $(mytextareaid).removeClass(); var gz_userlist = []; </script> <script src="/addons/taonyeditor/js/taonyeditor.js"></script> <script> layui.extend({ editor: '{/}/addons/taonyeditor/js/taonyeditor' }).use(['editor'], function () { var editor = layui.editor; // 1.渲染内容 $('.detail-body').each(function(){ var othis = $(this), html = othis.html(); othis.html(editor.content(html)); }); //获取后端接口的controller方法 var controller = "News"; // 2.从详情页自动调用端口过滤，获取描述信息(只有在add和edit才调用此方法) if(controller == 'Article' && (action == 'add' || action == 'edit')) { tinymce.get('L_content').on('mouseleave', function() { //var content = $(this).val(); var content = tinymce.get('L_content').getContent({format: 'text'}); content = content.replace(/[\r\n]/g,"").replace(/\n/g, '').replace(/\s/g, '').replace(/\t/g, ''); if(content.length >200) { content = content.substring(0,200); } $('[name="description"]').val(content); }); } }); </script> <script src="/static/res/mods/highlight.min.js"></script> <script> $(document).ready(function() { $('pre').each(function(i, block) { hljs.highlightBlock(block); }); }); </script> <script> var collection = "/collection/", articleJieset = "/news/jieset.html", articleDelete = "/Article/delete.html", commentJiedaZan = "/Comment/jiedaZan.html", commentJiedaCai = "/Comment/jiedaCai.html", commentGetDa = "/Comment/getDa.html", commentUpdateDa = "/Comment/updateDa.html", commentJiedaDelete = "/Comment/jiedaDelete.html", langCollection = "收藏", langCancelCollection = "收藏 -"; layui.use(['fly', 'face','colorpicker', 'laypage'], function(){ var $ = layui.jquery ,form = layui.form ,fly = layui.fly ,colorpicker = layui.colorpicker ,laytpl = layui.laytpl ,uid = layui.cache.user.uid ,laypage = layui.laypage; var id = "30946"; //如果你是采用模版自带的编辑器，你需要开启以下语句来解析。 var taonystatus = "1"; // 编辑器插件启用状态 var isShow = taonystatus ? false : true; if(isShow) { $('.detail-body').each(function(){ var othis = $(this), html = othis.html(); othis.html(fly.content(html)); }); } //评论需要登陆 form.on('submit(user-comment)',function (data){ var index = layer.load(1); var filed = data.field; if (uid == -1) { layer.msg('请先登陆',{icon:5,time:2000},function(){location.href = "/login.html"}); } else { $.ajax({ type: "post", url: "/news/comment.html", data: filed, dataType: "json", success:function (data) { if (data.code == 0) { layer.msg(data.msg,{icon:6,adim:6},function () { location.reload(true); }); }else { layer.open({title:'评论失败',content:data.msg,icon:5,anim:6}); } } }); } return false; }); //下载 $('#zip-download').click(function (){ var id = "30946"; $.ajax({ type:"get", url:"/news/download.html", data:{id:id}, success:function (res) { if(res.code == 0){ location.href = res.src; }else{ layer.msg(res.msg); return false; } } }); }); //关注 $(".guanzhu").click(function () { var user_id = "3794"; if(uid == -1){ layer.msg('请登录再操作', {icon: 6}, function(){location.href = "/login.html"}) return false; } $.post("/userfollow/add.html",{to_user_id:user_id},function(data){ if(data.code == 0){ layer.msg(data.msg,{icon:6,adim:6},function () { location.reload(true); }); } else { layer.msg(data.msg,{icon:6,adim:6}); } }) }); function scrollTo(prop){ $('html,body').animate({scrollTop: $(prop).offset().top + parseInt($(prop).css('padding-top'),10) + parseInt($(prop).css('margin-top'),10)},'slow'); } var hash = window.location.hash; if (hash !== '') { var elem = $('#' + hash.replace('#', '')); // 接下来可以继续使用elem变量进行操作 if(elem) { scrollTo(elem); } } else { // 处理URL中没有'#'字符的情况 } $(".comment-ks p").click(function () { let html = $(this).html(); var content = tinymce.get('L_content').getContent(); $("textarea#L_content").val(content+html); $("textarea#L_content").removeAttr("lay-verify"); tinymce.get('L_content').save(); form.render(); }); }); </script> <script> var importCssJs = { css: function (path) { if (!path || path.length === 0) { throw new Error('参数"path"错误'); } var head = document.getElementsByTagName('head')[0]; var link = document.createElement('link'); link.href = path; link.rel = 'stylesheet'; link.type = 'text/css'; head.appendChild(link); }, js: function (path) { if (!path || path.length === 0) { throw new Error('参数"path"错误'); } var head = document.getElementsByTagName('head')[0]; var script = document.createElement('script'); script.src = path; script.type = 'text/javascript'; head.appendChild(script); } } $(function () { importCssJs.css('/addons/markdown/easyeditor/css/easyeditor.css'); importCssJs.js('/addons/markdown/easyeditor/js/marked.min.js'); }); $("#content").removeClass().addClass('easyeditor-content'); layui.config({ base: '/addons/markdown/easyeditor/mods/' }).extend({ easyeditor: 'easyeditor' }).use(['easyeditor'], function () { var easyeditor = layui.easyeditor; easyeditor.init({ elem: '.editor' //textarea 元素class , uploadUrl: "/article/uploads.html?type=image" //图片上传地址 , videoUploadUrl: "/article/uploads.html?type=video", videoUploadSize: '102400' //限制的上传大小 单位kb 默认 10240 kb , uploadSize: '' //限制的上传大小 单位kb 默认 1024k , style: 'fangge',//内置样式 目前只有默认 和 方格两种 //codeStyle:'layuiCode', //代码风格 layuiCode风格 与 默认风格 //,codeSkin:'notepad' //代码框样式 默认不填 与notepad 该属性与codeStyle='layuiCodexw'搭配使用 //,buttonColor:'#FFB800' //自定义按钮颜色 //,hoverBgColor:'red' // 自定义鼠标悬浮背景颜色 //,hoverColor:'#000000' // 自定义鼠标悬浮按钮颜色 }); easyeditor.render({ elem: ".easyeditor-content" //存放md内容的元素ID }); function markdown() { var othis = $('.easyeditor-content'); var content = othis.html(); } }); </script> <script> //扫码阅读 $("#rdown").hover(function(){ $("#phonedl").show().stop(); },function(){ $("#phonedl").hide().stop(); }); $("#phonedl").hover(function(){ $("#phonedl").show().stop(); },function(){ $("#phonedl").hide().stop(); }); function PhoneDown(){ layer.open({ title: "扫码查阅", skin: 'layui-layer', content: "<img src='/qrcode/?text=https://www.xckfsq.com/article/detail.html?id=30946&size=230'>" }); } </script> </body> </html>