Events模块管理客户端事件,包括系统事件,如扩展API加载完毕、程序前后台切换等 ...
<div id="article_content" class="article_content clearfix"><link rel="stylesheet" href="https://csdnimg.cn/release/blogv2/dist/mdeditor/css/editerView/kdoc_html_views-1a98987dfd.css">
<link rel="stylesheet" href="https://csdnimg.cn/release/blogv2/dist/mdeditor/css/editerView/ck_htmledit_views-6e43165c0a.css">
<div id="content_views" class="htmledit_views">
<p style="margin-left:0;"><span style="color:#474747;"><span style="background-color:#f6f4f2;">Events模块管理客户端事件,包括系统事件,如扩展API加载完毕、程序前后台切换等。</span></span></p>
<h2 style="margin-left:.8em;"><span style="color:#f13a0e;"><strong><span style="background-color:#f6f4f2;">常量:</span></strong></span></h2>
<ul><li><ahref="https://blog.csdn.net/qq_40575646/article/details/122686172#plus.Events.%22plusready%22">"plusready"</a>: 扩展API加载完成事件</li><li><ahref="https://blog.csdn.net/qq_40575646/article/details/122686172#plus.Events.%22pause%22">"pause"</a>: 运行环境从前台切换到后台事件</li><li><ahref="https://blog.csdn.net/qq_40575646/article/details/122686172#plus.Events.%22resume%22">"resume"</a>: 运行环境从后台切换到前台事件</li><li><ahref="https://blog.csdn.net/qq_40575646/article/details/122686172#plus.Events.%22netchange%22">"netchange"</a>: 设备网络状态变化事件</li><li><ahref="https://blog.csdn.net/qq_40575646/article/details/122686172#plus.Events.%22newintent%22">"newintent"</a>: 新意图事件</li><li><ahref="https://blog.csdn.net/qq_40575646/article/details/122686172#plus.Events.%22plusscrollbottom%22">"plusscrollbottom"</a>: 页面滚动到底部事件</li><li><ahref="https://blog.csdn.net/qq_40575646/article/details/122686172#plus.Events.%22error%22">"error"</a>: 页面加载错误事件</li><li><ahref="https://blog.csdn.net/qq_40575646/article/details/122686172#plus.Events.%22background%22">"background"</a>: 应用切换到后台运行事件</li><li><ahref="https://blog.csdn.net/qq_40575646/article/details/122686172#plus.Events.%22foreground%22">"foreground"</a>: 应用切换到前台运行事件</li><li><ahref="https://blog.csdn.net/qq_40575646/article/details/122686172#plus.Events.%22trimmemory%22">"trimmemory"</a>: 应用需要清理内存事件</li><li><ahref="https://blog.csdn.net/qq_40575646/article/details/122686172#plus.Events.%22splashclosed%22">"splashclosed"</a>: 应用启动界面已关闭事件</li><li><ahref="https://blog.csdn.net/qq_40575646/article/details/122686172#plus.Events.%22keyboardchange%22">"keyboardchange"</a>: 软键盘变化事件</li><li><ahref="https://blog.csdn.net/qq_40575646/article/details/122686172#plus.Events.%22uistylechange%22">"uistylechange"</a>: 系统外观样式变化事件</li></ul>
<h2 style="margin-left:.8em;"><span style="color:#f13a0e;"><strong><span style="background-color:#f6f4f2;">方法:</span></strong></span></h2>
<ul><li><ahref="https://blog.csdn.net/qq_40575646/article/details/122686172#plus.Events.addEventListener">addEventListener</a>: 添加事件监听函数</li></ul>
<h2 style="margin-left:.8em;"><span style="color:#f13a0e;"><strong><span style="background-color:#f6f4f2;">回调方法:</span></strong></span></h2>
<ul><li><ahref="https://www.html5plus.org/doc/zh_cn/events.html#plus.Events.EventTrigCallback">EventTrigCallback</a>: 事件触发回调函数</li><li><ahref="https://blog.csdn.net/qq_40575646/article/details/122686172#plus.Events.ErrorEventTrigCallback">ErrorEventTrigCallback</a>: 页面加载错误事件回调函数</li></ul>
<h1 style="margin-left:0;"><span style="color:#474747;"><span style="background-color:#f6f4f2;"><!--LINK#0_16-->"plusready"</span></span></h1>
<p style="margin-left:0;"><span style="color:#474747;"><span style="background-color:#f6f4f2;">扩展API加载完成事件</span></span></p>
<pre class="has" style="margin-left:0;"><code class="language-prettyprint"><span style="background-color:#333333"><span style="color:#474747"><code><span style="color:#ffffff">
document</span><span style="color:#ffffff">.</span><span style="color:#ffffff">addEventListener</span><span style="color:#ffffff">(</span><span style="color:#ffa0a0">"plusready"</span><span style="color:#ffffff">,</span> <span style="color:#f0e68c"><strong>function</strong></span><span style="color:#ffffff">(){</span>
<span style="color:#87ceeb">//扩展API加载完成事</span>
<span style="color:#ffffff">},</span> <span style="color:#f0e68c"><strong>false</strong></span><span style="color:#ffffff">);</span>
</code></span></span></code></pre>
<h2 style="margin-left:.8em;"><span style="color:#f13a0e;"><strong><span style="background-color:#f6f4f2;">说明:</span></strong></span></h2>
<p style="margin-left:0;"><span style="color:#474747;"><span style="background-color:#f6f4f2;">String 类型</span></span></p>
<p style="margin-left:0;"><span style="color:#474747;"><span style="background-color:#f6f4f2;">为了保证HTML5扩展API的有效调用,页面加载扩展API完成后会触发此事件。 通常应该在页面开始加载时监听此事件,当此事件触发后,就可以安全的调用HTML5扩展API。 如果应用使用多页面,每个都会收到此事件。 注意:uni-app不需要关心此事件,框架已经封装确保5+ API能够有效调用。</span></span></p>
<h2 style="margin-left:.8em;"><span style="color:#f13a0e;"><strong><span style="background-color:#f6f4f2;">示例:</span></strong></span></h2>
<pre class="has" style="margin-left:0;"><code class="language-prettyprint"><span style="background-color:#333333"><span style="color:#474747"><code>
<span style="color:#87ceeb">// 监听plusready事件 </span>
<span style="color:#87ceeb">// uni-app项目中不要监听此事件,uni-app中不存在document对象,调用此方法会引起js错误</span><span style="color:#ffffff">
document</span><span style="color:#ffffff">.</span><span style="color:#ffffff">addEventListener</span><span style="color:#ffffff">(</span><span style="color:#ffa0a0">"plusready"</span><span style="color:#ffffff">,</span> <span style="color:#f0e68c"><strong>function</strong></span><span style="color:#ffffff">(){</span>
<span style="color:#87ceeb">// 扩展API加载完毕,现在可以正常调用扩展API</span>
<span style="color:#87ceeb">// ...... </span>
<span style="color:#ffffff">},</span> <span style="color:#f0e68c"><strong>false</strong></span><span style="color:#ffffff">);</span>
</code></span></span></code></pre>
<p style="margin-left:0;"><span style="color:#474747;"><span style="background-color:#f6f4f2;"><ahref="https://uniapp.dcloud.io/use-html5plus">uni-app使用plus注意事项</a></span></span></p>
<h1 style="margin-left:0;"><span style="color:#474747;"><span style="background-color:#f6f4f2;"><!--LINK#0_18-->"pause"</span></span></h1>
<p style="margin-left:0;"><span style="color:#474747;"><span style="background-color:#f6f4f2;">运行环境从前台切换到后台事件</span></span></p>
<pre class="has" style="margin-left:0;"><code class="language-prettyprint"><span style="background-color:#333333"><span style="color:#474747"><code><span style="color:#ffffff">
document</span><span style="color:#ffffff">.</span><span style="color:#ffffff">addEventListener</span><span style="color:#ffffff">(</span><span style="color:#ffa0a0">"pause"</span><span style="color:#ffffff">,</span> <span style="color:#f0e68c"><strong>function</strong></span><span style="color:#ffffff">(){</span>
<span style="color:#87ceeb">//从前台切换到后台</span>
<span style="color:#ffffff">},</span> <span style="color:#f0e68c"><strong>false</strong></span><span style="color:#ffffff">);</span>
</code></span></span></code></pre>
<h2 style="margin-left:.8em;"><span style="color:#f13a0e;"><strong><span style="background-color:#f6f4f2;">说明:</span></strong></span></h2>
<p style="margin-left:0;"><span style="color:#474747;"><span style="background-color:#f6f4f2;">String 类型</span></span></p>
<p style="margin-left:0;"><span style="color:#474747;"><span style="background-color:#f6f4f2;">当程序从前台切换到后台时会触发此事件。 若应用需要处理从前台切换到后台的事件行为,可通过注册“pause”事件监听。 注意:此事件可能早于"plusready"事件触发,如果在回调事件中需要调用5+API,建议在plusready回调事件触发后再监听。</span></span></p>
<h2 style="margin-left:.8em;"><span style="color:#f13a0e;"><strong><span style="background-color:#f6f4f2;">示例:</span></strong></span></h2>
<pre class="has" style="margin-left:0;"><code class="language-prettyprint"><span style="background-color:#333333"><span style="color:#474747"><code>
<span style="color:#cccccc"><!DOCTYPE html></span>
<span style="color:#f0e68c"><strong><html></strong></span>
<span style="color:#f0e68c"><strong><meta</strong></span> <span style="color:#bdb76b"><strong>charset</strong></span><span style="color:#ffffff">=</span><span style="color:#ffa0a0">"utf-8"</span><span style="color:#f0e68c"><strong>></strong></span>
<span style="color:#f0e68c"><strong><title></strong></span><span style="color:#ffffff">Events Example</span><span style="color:#f0e68c"><strong></title></strong></span>
<span style="color:#f0e68c"><strong><script</strong></span> <span style="color:#bdb76b"><strong>type</strong></span><span style="color:#ffffff">=</span><span style="color:#ffa0a0">"text/javascript"</span> <span style="color:#f0e68c"><strong>></strong></span>
<span style="color:#87ceeb">// 扩展API加载完毕后调用onPlusReady回调函数 </span><span style="color:#ffffff">
document</span><span style="color:#ffffff">.</span><span style="color:#ffffff">addEventListener</span><span style="color:#ffffff">(</span><span style="color:#ffa0a0">"plusready"</span><span style="color:#ffffff">,</span><span style="color:#ffffff"> onPlusReady</span><span style="color:#ffffff">,</span> <span style="color:#f0e68c"><strong>false</strong></span><span style="color:#ffffff">);</span>
<span style="color:#f0e68c"><strong>function</strong></span><span style="color:#ffffff"> onPlusReady</span><span style="color:#ffffff">(){</span><span style="color:#ffffff">
document</span><span style="color:#ffffff">.</span><span style="color:#ffffff">addEventListener</span><span style="color:#ffffff">(</span><span style="color:#ffa0a0">"pause"</span><span style="color:#ffffff">,</span><span style="color:#ffffff"> onAppPause</span><span style="color:#ffffff">,</span> <span style="color:#f0e68c"><strong>false</strong></span><span style="color:#ffffff">);</span>
<span style="color:#ffffff">}</span>
<span style="color:#f0e68c"><strong>function</strong></span><span style="color:#ffffff"> onAppPause</span><span style="color:#ffffff">(){</span><span style="color:#ffffff">
console</span><span style="color:#ffffff">.</span><span style="color:#ffffff">log</span><span style="color:#ffffff">(</span><span style="color:#ffa0a0">"Application paused!"</span><span style="color:#ffffff">);</span>
<span style="color:#ffffff">}</span>
<span style="color:#f0e68c"><strong></script></strong></span>
<span style="color:#f0e68c"><strong></head></strong></span>
<span style="color:#f0e68c"><strong><body</strong></span> <span style="color:#f0e68c"><strong>></strong></span>
<span style="color:#f0e68c"><strong></body></strong></span>
<span style="color:#f0e68c"><strong></html></strong></span>
</code></span></span></code></pre>
<p style="margin-left:0;"><span style="color:#474747;"><span style="background-color:#f6f4f2;"><ahref="https://uniapp.dcloud.io/use-html5plus">uni-app使用plus注意事项</a></span></span></p>
<h1 style="margin-left:0;"><span style="color:#474747;"><span style="background-color:#f6f4f2;"><!--LINK#0_20-->"resume"</span></span></h1>
<p style="margin-left:0;"><span style="color:#474747;"><span style="background-color:#f6f4f2;">运行环境从后台切换到前台事件</span></span></p>
<pre class="has" style="margin-left:0;"><code class="language-prettyprint"><span style="background-color:#333333"><span style="color:#474747"><code><span style="color:#ffffff">
document</span><span style="color:#ffffff">.</span><span style="color:#ffffff">addEventListener</span><span style="color:#ffffff">(</span><span style="color:#ffa0a0">"resume"</span><span style="color:#ffffff">,</span> <span style="color:#f0e68c"><strong>function</strong></span><span style="color:#ffffff">(){</span>
<span style="color:#87ceeb">//从后台切换到前台</span>
<span style="color:#ffffff">},</span> <span style="color:#f0e68c"><strong>false</strong></span><span style="color:#ffffff">);</span>
</code></span></span></code></pre>
<h2 style="margin-left:.8em;"><span style="color:#f13a0e;"><strong><span style="background-color:#f6f4f2;">说明:</span></strong></span></h2>
<p style="margin-left:0;"><span style="color:#474747;"><span style="background-color:#f6f4f2;">String 类型</span></span></p>
<p style="margin-left:0;"><span style="color:#474747;"><span style="background-color:#f6f4f2;">当程序从后台切换到前台时会触发此事件。 若应用需要处理从后台切换到前台的事件行为,可通过注册“resume”事件监听。 注意:此事件可能早于"plusready"事件触发,如果在回调事件中需要调用5+API,建议在plusready回调事件触发后再监听。</span></span></p>
<h2 style="margin-left:.8em;"><span style="color:#f13a0e;"><strong><span style="background-color:#f6f4f2;">示例:</span></strong></span></h2>
<pre class="has" style="margin-left:0;"><code class="language-prettyprint"><span style="background-color:#333333"><span style="color:#474747"><code>
<span style="color:#cccccc"><!DOCTYPE html></span>
<span style="color:#f0e68c"><strong><html></strong></span>
<span style="color:#f0e68c"><strong><head></strong></span>
<span style="color:#f0e68c"><strong><meta</strong></span> <span style="color:#bdb76b"><strong>charset</strong></span><span style="color:#ffffff">=</span><span style="color:#ffa0a0">"utf-8"</span><span style="color:#f0e68c"><strong>></strong></span>
<span style="color:#f0e68c"><strong><title></strong></span><span style="color:#ffffff">Events Example</span><span style="color:#f0e68c"><strong></title></strong></span>
<span style="color:#f0e68c"><strong><script</strong></span> <span style="color:#bdb76b"><strong>type</strong></span><span style="color:#ffffff">=</span><span style="color:#ffa0a0">"text/javascript"</span> <span style="color:#f0e68c"><strong>></strong></span>
<span style="color:#87ceeb">// 扩展API加载完毕后调用onPlusReady回调函数 </span><span style="color:#ffffff">
document</span><span style="color:#ffffff">.</span><span style="color:#ffffff">addEventListener</span><span style="color:#ffffff">(</span><span style="color:#ffa0a0">"plusready"</span><span style="color:#ffffff">,</span><span style="color:#ffffff"> onPlusReady</span><span style="color:#ffffff">,</span> <span style="color:#f0e68c"><strong>false</strong></span><span style="color:#ffffff">);</span>
<span style="color:#f0e68c"><strong>function</strong></span><span style="color:#ffffff"> onPlusReady</span><span style="color:#ffffff">(){</span><span style="color:#ffffff">
document</span><span style="color:#ffffff">.</span><span style="color:#ffffff">addEventListener</span><span style="color:#ffffff">(</span><span style="color:#ffa0a0">"resume"</span><span style="color:#ffffff">,</span><span style="color:#ffffff"> onAppReume</span><span style="color:#ffffff">,</span> <span style="color:#f0e68c"><strong>false</strong></span><span style="color:#ffffff">);</span>
<span style="color:#ffffff">}</span>
<span style="color:#f0e68c"><strong>function</strong></span><span style="color:#ffffff"> onAppReume</span><span style="color:#ffffff">(){</span><span style="color:#ffffff">
alert</span><span style="color:#ffffff">(</span><span style="color:#ffa0a0">"Application resumed!"</span><span style="color:#ffffff">);</span>
<span style="color:#ffffff">}</span>
<span style="color:#f0e68c"><strong></script></strong></span>
<span style="color:#f0e68c"><strong></head></strong></span>
<span style="color:#f0e68c"><strong><body</strong></span> <span style="color:#f0e68c"><strong>></strong></span>
<span style="color:#f0e68c"><strong></body></strong></span>
<span style="color:#f0e68c"><strong></html></strong></span>
</code></span></span></code></pre>
<p style="margin-left:0;"><span style="color:#474747;"><span style="background-color:#f6f4f2;"><ahref="https://uniapp.dcloud.io/use-html5plus">uni-app使用plus注意事项</a></span></span></p>
<h1 style="margin-left:0;"><span style="color:#474747;"><span style="background-color:#f6f4f2;"><!--LINK#0_22-->"netchange"</span></span></h1>
<p style="margin-left:0;"><span style="color:#474747;"><span style="background-color:#f6f4f2;">设备网络状态变化事件</span></span></p>
<pre class="has" style="margin-left:0;"><code class="language-prettyprint"><span style="background-color:#333333"><span style="color:#474747"><code><span style="color:#ffffff">
document</span><span style="color:#ffffff">.</span><span style="color:#ffffff">addEventListener</span><span style="color:#ffffff">(</span><span style="color:#ffa0a0">"netchange"</span><span style="color:#ffffff">,</span> <span style="color:#f0e68c"><strong>function</strong></span><span style="color:#ffffff">(){</span>
<span style="color:#87ceeb">//网络状态变化</span>
<span style="color:#ffffff">},</span> <span style="color:#f0e68c"><strong>false</strong></span><span style="color:#ffffff">);</span>
</code></span></span></code></pre>
<h2 style="margin-left:.8em;"><span style="color:#f13a0e;"><strong><span style="background-color:#f6f4f2;">说明:</span></strong></span></h2>
<p style="margin-left:0;"><span style="color:#474747;"><span style="background-color:#f6f4f2;">String 类型</span></span></p>
<p style="margin-left:0;"><span style="color:#474747;"><span style="background-color:#f6f4f2;">设备的网络状态发生时会触发此事件。 若应用需要根据网络状态变化进行业务处理,可通过注册“netchange”事件监听。 注意:此事件可能早于"plusready"事件触发,如果在回调事件中需要调用5+API,建议在plusready回调事件触发后再监听。</span></span></p>
<h2 style="margin-left:.8em;"><span style="color:#f13a0e;"><strong><span style="background-color:#f6f4f2;">示例:</span></strong></span></h2>
<pre class="has" style="margin-left:0;"><code class="language-prettyprint"><span style="background-color:#333333"><span style="color:#474747"><code>
<span style="color:#cccccc"><!DOCTYPE html></span>
<span style="color:#f0e68c"><strong><html></strong></span>
<span style="color:#f0e68c"><strong><head></strong></span>
<span style="color:#f0e68c"><strong><meta</strong></span> <span style="color:#bdb76b"><strong>charset</strong></span><span style="color:#ffffff">=</span><span style="color:#ffa0a0">"utf-8"</span><span style="color:#f0e68c"><strong>></strong></span>
<span style="color:#f0e68c"><strong><title></strong></span><span style="color:#ffffff">Events Example</span><span style="color:#f0e68c"><strong></title></strong></span>
<span style="color:#f0e68c"><strong><script</strong></span> <span style="color:#bdb76b"><strong>type</strong></span><span style="color:#ffffff">=</span><span style="color:#ffa0a0">"text/javascript"</span> <span style="color:#f0e68c"><strong>></strong></span>
<span style="color:#87ceeb">// 扩展API加载完毕后调用onPlusReady回调函数 </span><span style="color:#ffffff">
document</span><span style="color:#ffffff">.</span><span style="color:#ffffff">addEventListener</span><span style="color:#ffffff">(</span><span style="color:#ffa0a0">"plusready"</span><span style="color:#ffffff">,</span><span style="color:#ffffff"> onPlusReady</span><span style="color:#ffffff">,</span> <span style="color:#f0e68c"><strong>false</strong></span><span style="color:#ffffff">);</span>
<span style="color:#f0e68c"><strong>function</strong></span><span style="color:#ffffff"> onPlusReady</span><span style="color:#ffffff">(){</span><span style="color:#ffffff">
document</span><span style="color:#ffffff">.</span><span style="color:#ffffff">addEventListener</span><span style="color:#ffffff">(</span><span style="color:#ffa0a0">"netchange"</span><span style="color:#ffffff">,</span><span style="color:#ffffff"> onNetChange</span><span style="color:#ffffff">,</span> <span style="color:#f0e68c"><strong>false</strong></span><span style="color:#ffffff">);</span>
<span style="color:#ffffff">}</span>
<span style="color:#f0e68c"><strong>function</strong></span><span style="color:#ffffff"> onNetChange</span><span style="color:#ffffff">(){</span>
<span style="color:#f0e68c"><strong>var</strong></span><span style="color:#ffffff"> nt </span><span style="color:#ffffff">=</span><span style="color:#ffffff"> plus</span><span style="color:#ffffff">.</span><span style="color:#ffffff">networkinfo</span><span style="color:#ffffff">.</span><span style="color:#ffffff">getCurrentType</span><span style="color:#ffffff">();</span>
<span style="color:#f0e68c"><strong>switch</strong></span> <span style="color:#ffffff">(</span><span style="color:#ffffff">nt</span><span style="color:#ffffff">){</span>
<span style="color:#f0e68c"><strong>case</strong></span><span style="color:#ffffff"> plus</span><span style="color:#ffffff">.</span><span style="color:#ffffff">networkinfo</span><span style="color:#ffffff">.</span><span style="color:#ffffff">CONNECTION_ETHERNET</span><span style="color:#ffffff">:</span>
<span style="color:#f0e68c"><strong>case</strong></span><span style="color:#ffffff"> plus</span><span style="color:#ffffff">.</span><span style="color:#ffffff">networkinfo</span><span style="color:#ffffff">.</span><span style="color:#ffffff">CONNECTION_WIFI</span><span style="color:#ffffff">:</span><span style="color:#ffffff">
alert</span><span style="color:#ffffff">(</span><span style="color:#ffa0a0">"Switch to Wifi networks!"</span><span style="color:#ffffff">);</span>
<span style="color:#f0e68c"><strong>break</strong></span><span style="color:#ffffff">;</span>
<span style="color:#f0e68c"><strong>case</strong></span><span style="color:#ffffff"> plus</span><span style="color:#ffffff">.</span><span style="color:#ffffff">networkinfo</span><span style="color:#ffffff">.</span><span style="color:#ffffff">CONNECTION_CELL2G</span><span style="color:#ffffff">:</span>
<span style="color:#f0e68c"><strong>case</strong></span><span style="color:#ffffff"> plus</span><span style="color:#ffffff">.</span><span style="color:#ffffff">networkinfo</span><span style="color:#ffffff">.</span><span style="color:#ffffff">CONNECTION_CELL3G</span><span style="color:#ffffff">:</span>
<span style="color:#f0e68c"><strong>case</strong></span><span style="color:#ffffff"> plus</span><span style="color:#ffffff">.</span><span style="color:#ffffff">networkinfo</span><span style="color:#ffffff">.</span><span style="color:#ffffff">CONNECTION_CELL4G</span><span style="color:#ffffff">:</span><span style="color:#ffffff">
alert</span><span style="color:#ffffff">(</span><span style="color:#ffa0a0">"Switch to Cellular networks!"</span><span style="color:#ffffff">);</span>
<span style="color:#f0e68c"><strong>break</strong></span><span style="color:#ffffff">;</span>
<span style="color:#f0e68c"><strong>default</strong></span><span style="color:#ffffff">:</span><span style="color:#ffffff">
alert</span><span style="color:#ffffff">(</span><span style="color:#ffa0a0">"Not networks!"</span><span style="color:#ffffff">);</span>
<span style="color:#f0e68c"><strong>break</strong></span><span style="color:#ffffff">;</span>
<span style="color:#ffffff">}</span>
<span style="color:#ffffff">}</span>
<span style="color:#f0e68c"><strong></script></strong></span>
<span style="color:#f0e68c"><strong></head></strong></span>
<span style="color:#f0e68c"><strong><body</strong></span> <span style="color:#f0e68c"><strong>></strong></span>
<span style="color:#f0e68c"><strong></body></strong></span>
<span style="color:#f0e68c"><strong></html></strong></span>
</code></span></span></code></pre>
<p style="margin-left:0;"><span style="color:#474747;"><span style="background-color:#f6f4f2;"><ahref="https://uniapp.dcloud.io/use-html5plus">uni-app使用plus注意事项</a></span></span></p>
<h1 style="margin-left:0;"><span style="color:#474747;"><span style="background-color:#f6f4f2;"><!--LINK#0_24-->"newintent"</span></span></h1>
<p style="margin-left:0;"><span style="color:#474747;"><span style="background-color:#f6f4f2;">新意图事件</span></span></p>
<pre class="has" style="margin-left:0;"><code class="language-prettyprint"><span style="background-color:#333333"><span style="color:#474747"><code><span style="color:#ffffff">
document</span><span style="color:#ffffff">.</span><span style="color:#ffffff">addEventListener</span><span style="color:#ffffff">(</span><span style="color:#ffa0a0">"newintent"</span><span style="color:#ffffff">,</span> <span style="color:#f0e68c"><strong>function</strong></span><span style="color:#ffffff">(){</span>
<span style="color:#87ceeb">//新意图</span>
<span style="color:#ffffff">},</span> <span style="color:#f0e68c"><strong>false</strong></span><span style="color:#ffffff">);</span>
</code></span></span></code></pre>
<h2 style="margin-left:.8em;"><span style="color:#f13a0e;"><strong><span style="background-color:#f6f4f2;">说明:</span></strong></span></h2>
<p style="margin-left:0;"><span style="color:#474747;"><span style="background-color:#f6f4f2;">String 类型</span></span></p>
<p style="margin-left:0;"><span style="color:#474747;"><span style="background-color:#f6f4f2;">程序切换到后台后被第三方程序激活到前台时触发此事件。 若应用需要根据第三方程序调用时进行业务处理(如判断传入的参数打开指定页面),可通过注册“newintent”事件监听。 注意:此事件可能早于"plusready"事件触发,如果在回调事件中需要调用5+API,建议在plusready回调事件触发后再监听。</span></span></p>
<h2 style="margin-left:.8em;"><span style="color:#f13a0e;"><strong><span style="background-color:#f6f4f2;">示例:</span></strong></span></h2>
<pre class="has" style="margin-left:0;"><code class="language-prettyprint"><span style="background-color:#333333"><span style="color:#474747"><code>
<span style="color:#cccccc"><!DOCTYPE html></span>
<span style="color:#f0e68c"><strong><html></strong></span>
<span style="color:#f0e68c"><strong><head></strong></span>
<span style="color:#f0e68c"><strong><meta</strong></span> <span style="color:#bdb76b"><strong>charset</strong></span><span style="color:#ffffff">=</span><span style="color:#ffa0a0">"utf-8"</span><span style="color:#f0e68c"><strong>></strong></span>
<span style="color:#f0e68c"><strong><title></strong></span><span style="color:#ffffff">Events Example</span><span style="color:#f0e68c"><strong></title></strong></span>
<span style="color:#f0e68c"><strong><script</strong></span> <span style="color:#bdb76b"><strong>type</strong></span><span style="color:#ffffff">=</span><span style="color:#ffa0a0">"text/javascript"</span> <span style="color:#f0e68c"><strong>></strong></span>
<span style="color:#87ceeb">// 扩展API加载完毕后调用onPlusReady回调函数</span><span style="color:#ffffff">
document</span><span style="color:#ffffff">.</span><span style="color:#ffffff">addEventListener</span><span style="color:#ffffff">(</span><span style="color:#ffa0a0">"plusready"</span><span style="color:#ffffff">,</span><span style="color:#ffffff"> onPlusReady</span><span style="color:#ffffff">,</span> <span style="color:#f0e68c"><strong>false</strong></span><span style="color:#ffffff">);</span>
<span style="color:#f0e68c"><strong>function</strong></span><span style="color:#ffffff"> onPlusReady</span><span style="color:#ffffff">(){</span><span style="color:#ffffff">
document</span><span style="color:#ffffff">.</span><span style="color:#ffffff">addEventListener</span><span style="color:#ffffff">(</span><span style="color:#ffa0a0">"newintent"</span><span style="color:#ffffff">,</span><span style="color:#ffffff"> onNetIntent</span><span style="color:#ffffff">,</span> <span style="color:#f0e68c"><strong>false</strong></span><span style="color:#ffffff">);</span>
<span style="color:#ffffff">}</span>
<span style="color:#f0e68c"><strong>function</strong></span><span style="color:#ffffff"> onNetIntent</span><span style="color:#ffffff">(){</span>
<span style="color:#87ceeb">// 获取新意图传入的参数</span>
<span style="color:#f0e68c"><strong>var</strong></span><span style="color:#ffffff"> args </span><span style="color:#ffffff">=</span><span style="color:#ffffff"> plus</span><span style="color:#ffffff">.</span><span style="color:#ffffff">runtime</span><span style="color:#ffffff">.</span><span style="color:#ffffff">arguments</span><span style="color:#ffffff">;</span>
<span style="color:#87ceeb">// 处理意图事件</span>
<span style="color:#ffffff">}</span>
<span style="color:#f0e68c"><strong></script></strong></span>
<span style="color:#f0e68c"><strong></head></strong></span>
<span style="color:#f0e68c"><strong><body</strong></span> <span style="color:#f0e68c"><strong>></strong></span>
<span style="color:#f0e68c"><strong></body></strong></span>
<span style="color:#f0e68c"><strong></html></strong></span>
</code></span></span></code></pre>
<p style="margin-left:0;"><span style="color:#474747;"><span style="background-color:#f6f4f2;"><ahref="https://uniapp.dcloud.io/use-html5plus">uni-app使用plus注意事项</a></span></span></p>
<h1 style="margin-left:0;"><span style="color:#474747;"><span style="background-color:#f6f4f2;"><!--LINK#0_26-->"plusscrollbottom"</span></span></h1>
<p style="margin-left:0;"><span style="color:#474747;"><span style="background-color:#f6f4f2;">页面滚动到底部事件</span></span></p>
<pre class="has" style="margin-left:0;"><code class="language-prettyprint"><span style="background-color:#333333"><span style="color:#474747"><code><span style="color:#ffffff">
document</span><span style="color:#ffffff">.</span><span style="color:#ffffff">addEventListener</span><span style="color:#ffffff">(</span><span style="color:#ffa0a0">"plusscrollbottom"</span><span style="color:#ffffff">,</span> <span style="color:#f0e68c"><strong>function</strong></span><span style="color:#ffffff">(){</span>
<span style="color:#87ceeb">//页面滚动到底部</span>
<span style="color:#ffffff">},</span> <span style="color:#f0e68c"><strong>false</strong></span><span style="color:#ffffff">);</span>
</code></span></span></code></pre>
<h2 style="margin-left:.8em;"><span style="color:#f13a0e;"><strong><span style="background-color:#f6f4f2;">说明:</span></strong></span></h2>
<p style="margin-left:0;"><span style="color:#474747;"><span style="background-color:#f6f4f2;">String 类型</span></span></p>
<p style="margin-left:0;"><span style="color:#474747;"><span style="background-color:#f6f4f2;">当滚动Webview窗口页面到底部时触发此事件。</span></span></p>
<h2 style="margin-left:.8em;"><span style="color:#f13a0e;"><strong><span style="background-color:#f6f4f2;">示例:</span></strong></span></h2>
<pre class="has" style="margin-left:0;"><code class="language-prettyprint"><span style="background-color:#333333"><span style="color:#474747"><code>
<span style="color:#cccccc"><!DOCTYPE html></span>
<span style="color:#f0e68c"><strong><html></strong></span>
<span style="color:#f0e68c"><strong><head></strong></span>
<span style="color:#f0e68c"><strong><meta</strong></span> <span style="color:#bdb76b"><strong>charset</strong></span><span style="color:#ffffff">=</span><span style="color:#ffa0a0">"utf-8"</span><span style="color:#f0e68c"><strong>></strong></span>
<span style="color:#f0e68c"><strong><title></strong></span><span style="color:#ffffff">Events Example</span><span style="color:#f0e68c"><strong></title></strong></span>
<span style="color:#f0e68c"><strong><script</strong></span> <span style="color:#bdb76b"><strong>type</strong></span><span style="color:#ffffff">=</span><span style="color:#ffa0a0">"text/javascript"</span> <span style="color:#f0e68c"><strong>></strong></span>
<span style="color:#87ceeb">// 扩展API加载完毕后调用onPlusReady回调函数</span><span style="color:#ffffff">
document</span><span style="color:#ffffff">.</span><span style="color:#ffffff">addEventListener</span><span style="color:#ffffff">(</span><span style="color:#ffa0a0">"plusready"</span><span style="color:#ffffff">,</span><span style="color:#ffffff"> onPlusReady</span><span style="color:#ffffff">,</span> <span style="color:#f0e68c"><strong>false</strong></span><span style="color:#ffffff">);</span>
<span style="color:#f0e68c"><strong>function</strong></span><span style="color:#ffffff"> onPlusReady</span><span style="color:#ffffff">(){</span><span style="color:#ffffff">
document</span><span style="color:#ffffff">.</span><span style="color:#ffffff">addEventListener</span><span style="color:#ffffff">(</span><span style="color:#ffa0a0">"plusscrollbottom"</span><span style="color:#ffffff">,</span><span style="color:#ffffff"> onScrollToBottom</span><span style="color:#ffffff">,</span> <span style="color:#f0e68c"><strong>false</strong></span><span style="color:#ffffff">);</span>
<span style="color:#ffffff">}</span>
<span style="color:#f0e68c"><strong>function</strong></span><span style="color:#ffffff"> onScrollToBottom</span><span style="color:#ffffff">(){</span>
<span style="color:#87ceeb">// 处理滚动到窗口底部事件</span>
<span style="color:#ffffff">}</span>
<span style="color:#f0e68c"><strong></script></strong></span>
<span style="color:#f0e68c"><strong></head></strong></span>
<span style="color:#f0e68c"><strong><body</strong></span> <span style="color:#f0e68c"><strong>></strong></span>
<span style="color:#f0e68c"><strong></body></strong></span>
<span style="color:#f0e68c"><strong></html></strong></span>
</code></span></span></code></pre>
<p style="margin-left:0;"><span style="color:#474747;"><span style="background-color:#f6f4f2;"><ahref="https://uniapp.dcloud.io/use-html5plus">uni-app使用plus注意事项</a></span></span></p>
<h1 style="margin-left:0;"><span style="color:#474747;"><span style="background-color:#f6f4f2;"><!--LINK#0_28-->"error"</span></span></h1>
<p style="margin-left:0;"><span style="color:#474747;"><span style="background-color:#f6f4f2;">页面加载错误事件</span></span></p>
<pre class="has" style="margin-left:0;"><code class="language-prettyprint"><span style="background-color:#333333"><span style="color:#474747"><code><span style="color:#ffffff">
document</span><span style="color:#ffffff">.</span><span style="color:#ffffff">addEventListener</span><span style="color:#ffffff">(</span><span style="color:#ffa0a0">"error"</span><span style="color:#ffffff">,</span> <span style="color:#f0e68c"><strong>function</strong></span><span style="color:#ffffff">(</span><span style="color:#ffffff">e</span><span style="color:#ffffff">){</span>
<span style="color:#ffffff">},</span> <span style="color:#f0e68c"><strong>false</strong></span><span style="color:#ffffff">);</span>
</code></span></span></code></pre>
<h2 style="margin-left:.8em;"><span style="color:#f13a0e;"><strong><span style="background-color:#f6f4f2;">说明:</span></strong></span></h2>
<p style="margin-left:0;"><span style="color:#474747;"><span style="background-color:#f6f4f2;">String 类型</span></span></p>
<p style="margin-left:0;"><span style="color:#474747;"><span style="background-color:#f6f4f2;">当Webview窗口加载页面失败后打开错误页面时触发此事件。 注意:此事件仅在错误页面中才触发。</span></span></p>
<h2 style="margin-left:.8em;"><span style="color:#f13a0e;"><strong><span style="background-color:#f6f4f2;">示例:</span></strong></span></h2>
<pre class="has" style="margin-left:0;"><code class="language-prettyprint"><span style="background-color:#333333"><span style="color:#474747"><code>
<span style="color:#cccccc"><!DOCTYPE html></span>
<span style="color:#f0e68c"><strong><html></strong></span>
<span style="color:#f0e68c"><strong><head></strong></span>
<span style="color:#f0e68c"><strong><meta</strong></span> <span style="color:#bdb76b"><strong>charset</strong></span><span style="color:#ffffff">=</span><span style="color:#ffa0a0">"utf-8"</span><span style="color:#f0e68c"><strong>/></strong></span>
<span style="color:#f0e68c"><strong><meta</strong></span> <span style="color:#bdb76b"><strong>name</strong></span><span style="color:#ffffff">=</span><span style="color:#ffa0a0">"viewport"</span> <span style="color:#bdb76b"><strong>content</strong></span><span style="color:#ffffff">=</span><span style="color:#ffa0a0">"initial-scale=1.0, maximum-scale=1.0, user-scalable=no"</span><span style="color:#f0e68c"><strong>/></strong></span>
<span style="color:#f0e68c"><strong><meta</strong></span> <span style="color:#bdb76b"><strong>name</strong></span><span style="color:#ffffff">=</span><span style="color:#ffa0a0">"HandheldFriendly"</span> <span style="color:#bdb76b"><strong>content</strong></span><span style="color:#ffffff">=</span><span style="color:#ffa0a0">"true"</span><span style="color:#f0e68c"><strong>/></strong></span>
<span style="color:#f0e68c"><strong><meta</strong></span> <span style="color:#bdb76b"><strong>name</strong></span><span style="color:#ffffff">=</span><span style="color:#ffa0a0">"MobileOptimized"</span> <span style="color:#bdb76b"><strong>content</strong></span><span style="color:#ffffff">=</span><span style="color:#ffa0a0">"320"</span><span style="color:#f0e68c"><strong>/></strong></span>
<span style="color:#f0e68c"><strong><title></strong></span><span style="color:#ffffff">Error</span><span style="color:#f0e68c"><strong></title></strong></span>
<span style="color:#f0e68c"><strong><script</strong></span> <span style="color:#bdb76b"><strong>type</strong></span><span style="color:#ffffff">=</span><span style="color:#ffa0a0">"text/javascript"</span><span style="color:#f0e68c"><strong>></strong></span>
<span style="color:#87ceeb">// H5 plus事件处理</span>
<span style="color:#f0e68c"><strong>var</strong></span><span style="color:#ffffff"> ws</span><span style="color:#ffffff">=</span><span style="color:#f0e68c"><strong>null</strong></span><span style="color:#ffffff">;</span>
<span style="color:#f0e68c"><strong>function</strong></span><span style="color:#ffffff"> plusReady</span><span style="color:#ffffff">(){</span>
<span style="color:#87ceeb">// Android处理返回键</span><span style="color:#ffffff">
plus</span><span style="color:#ffffff">.</span><span style="color:#ffffff">key</span><span style="color:#ffffff">.</span><span style="color:#ffffff">addEventListener</span><span style="color:#ffffff">(</span><span style="color:#ffa0a0">'backbutton'</span><span style="color:#ffffff">,</span><span style="color:#f0e68c"><strong>function</strong></span><span style="color:#ffffff">(){</span>
<span style="color:#ffffff">(</span><span style="color:#ffffff">history</span><span style="color:#ffffff">.</span><span style="color:#ffffff">length</span><span style="color:#ffffff">==</span><span style="color:#cd5c5c">1</span><span style="color:#ffffff">)&&</span><span style="color:#ffffff">ws</span><span style="color:#ffffff">.</span><span style="color:#ffffff">close</span><span style="color:#ffffff">();</span>
<span style="color:#f0e68c"><strong>var</strong></span><span style="color:#ffffff"> c</span><span style="color:#ffffff">=</span><span style="color:#ffffff">setTimeout</span><span style="color:#ffffff">(</span><span style="color:#f0e68c"><strong>function</strong></span><span style="color:#ffffff">(){</span><span style="color:#ffffff">
ws</span><span style="color:#ffffff">.</span><span style="color:#ffffff">close</span><span style="color:#ffffff">();</span>
<span style="color:#ffffff">},</span><span style="color:#cd5c5c">1000</span><span style="color:#ffffff">);</span><span style="color:#ffffff">
window</span><span style="color:#ffffff">.</span><span style="color:#ffffff">onbeforeunload</span><span style="color:#ffffff">=</span><span style="color:#f0e68c"><strong>function</strong></span><span style="color:#ffffff">(){</span><span style="color:#ffffff">
clearTimeout</span><span style="color:#ffffff">(</span><span style="color:#ffffff">c</span><span style="color:#ffffff">);</span>
<span style="color:#ffffff">}</span><span style="color:#ffffff">
history</span><span style="color:#ffffff">.</span><span style="color:#ffffff">go</span><span style="color:#ffffff">(-</span><span style="color:#cd5c5c">2</span><span style="color:#ffffff">);</span>
<span style="color:#ffffff">},</span><span style="color:#f0e68c"><strong>false</strong></span><span style="color:#ffffff">);</span><span style="color:#ffffff">
ws</span><span style="color:#ffffff">=</span><span style="color:#ffffff">plus</span><span style="color:#ffffff">.</span><span style="color:#ffffff">webview</span><span style="color:#ffffff">.</span><span style="color:#ffffff">currentWebview</span><span style="color:#ffffff">();</span>
<span style="color:#ffffff">}</span>
<span style="color:#f0e68c"><strong>if</strong></span><span style="color:#ffffff">(</span><span style="color:#ffffff">window</span><span style="color:#ffffff">.</span><span style="color:#ffffff">plus</span><span style="color:#ffffff">){</span><span style="color:#ffffff">
plusReady</span><span style="color:#ffffff">();</span>
<span style="color:#ffffff">}</span><span style="color:#f0e68c"><strong>else</strong></span><span style="color:#ffffff">{</span><span style="color:#ffffff">
document</span><span style="color:#ffffff">.</span><span style="color:#ffffff">addEventListener</span><span style="color:#ffffff">(</span><span style="color:#ffa0a0">'plusready'</span><span style="color:#ffffff">,</span><span style="color:#ffffff">plusReady</span><span style="color:#ffffff">,</span><span style="color:#f0e68c"><strong>false</strong></span><span style="color:#ffffff">);</span>
<span style="color:#ffffff">}</span><span style="color:#ffffff">
document</span><span style="color:#ffffff">.</span><span style="color:#ffffff">addEventListener</span><span style="color:#ffffff">(</span><span style="color:#ffa0a0">'touchstart'</span><span style="color:#ffffff">,</span><span style="color:#f0e68c"><strong>function</strong></span><span style="color:#ffffff">(){</span>
<span style="color:#f0e68c"><strong>return</strong></span> <span style="color:#f0e68c"><strong>false</strong></span><span style="color:#ffffff">;</span>
<span style="color:#ffffff">},</span><span style="color:#f0e68c"><strong>true</strong></span><span style="color:#ffffff">);</span>
<span style="color:#87ceeb">// 禁止选择</span><span style="color:#ffffff">
document</span><span style="color:#ffffff">.</span><span style="color:#ffffff">oncontextmenu</span><span style="color:#ffffff">=</span><span style="color:#f0e68c"><strong>function</strong></span><span style="color:#ffffff">(){</span>
<span style="color:#f0e68c"><strong>return</strong></span> <span style="color:#f0e68c"><strong>false</strong></span><span style="color:#ffffff">;</span>
<span style="color:#ffffff">};</span>
<span style="color:#87ceeb">// 获取错误信息</span><span style="color:#ffffff">
document</span><span style="color:#ffffff">.</span><span style="color:#ffffff">addEventListener</span><span style="color:#ffffff">(</span><span style="color:#ffa0a0">"error"</span><span style="color:#ffffff">,</span><span style="color:#f0e68c"><strong>function</strong></span><span style="color:#ffffff">(</span><span style="color:#ffffff">e</span><span style="color:#ffffff">){</span><span style="color:#ffffff">
info</span><span style="color:#ffffff">.</span><span style="color:#ffffff">innerText</span><span style="color:#ffffff">=</span><span style="color:#ffa0a0">"请求的页面("</span><span style="color:#ffffff">+</span><span style="color:#ffffff">e</span><span style="color:#ffffff">.</span><span style="color:#ffffff">href</span><span style="color:#ffffff">+</span><span style="color:#ffa0a0">")无法打开"</span><span style="color:#ffffff">;</span>
<span style="color:#ffffff">},</span><span style="color:#f0e68c"><strong>false</strong></span><span style="color:#ffffff">);</span>
<span style="color:#f0e68c"><strong></script></strong></span>
<span style="color:#f0e68c"><strong><style></strong></span>
<span style="color:#ffffff">*{</span>
<span style="color:#ffffff">-</span><span style="color:#ffffff">webkit</span><span style="color:#ffffff">-</span><span style="color:#ffffff">user</span><span style="color:#ffffff">-</span><span style="color:#f0e68c"><strong>select</strong></span><span style="color:#ffffff">:</span><span style="color:#ffffff"> none</span><span style="color:#ffffff">;</span>
<span style="color:#ffffff">}</span><span style="color:#ffffff">
html</span><span style="color:#ffffff">,</span><span style="color:#ffffff">body</span><span style="color:#ffffff">{</span><span style="color:#ffffff">
margin</span><span style="color:#ffffff">:</span> <span style="color:#cd5c5c">0px</span><span style="color:#ffffff">;</span><span style="color:#ffffff">
padding</span><span style="color:#ffffff">:</span> <span style="color:#cd5c5c">0px</span><span style="color:#ffffff">;</span><span style="color:#ffffff">
width</span><span style="color:#ffffff">:</span> <span style="color:#cd5c5c">100</span><span style="color:#ffffff">%;</span><span style="color:#ffffff">
height</span><span style="color:#ffffff">:</span> <span style="color:#cd5c5c">100</span><span style="color:#ffffff">%;</span><span style="color:#ffffff">
text</span><span style="color:#ffffff">-</span><span style="color:#ffffff">align</span><span style="color:#ffffff">:</span><span style="color:#ffffff"> center</span><span style="color:#ffffff">;</span>
<span style="color:#ffffff">-</span><span style="color:#ffffff">webkit</span><span style="color:#ffffff">-</span><span style="color:#ffffff">touch</span><span style="color:#ffffff">-</span><span style="color:#ffffff">callout</span><span style="color:#ffffff">:</span><span style="color:#ffffff">none</span><span style="color:#ffffff">;</span>
<span style="color:#ffffff">-</span><span style="color:#ffffff">webkit</span><span style="color:#ffffff">-</span><span style="color:#ffffff">tap</span><span style="color:#ffffff">-</span><span style="color:#ffffff">highlight</span><span style="color:#ffffff">-</span><span style="color:#ffffff">color</span><span style="color:#ffffff">:</span><span style="color:#ffffff">rgba</span><span style="color:#ffffff">(</span><span style="color:#cd5c5c">0</span><span style="color:#ffffff">,</span><span style="color:#cd5c5c">0</span><span style="color:#ffffff">,</span><span style="color:#cd5c5c">0</span><span style="color:#ffffff">,</span><span style="color:#cd5c5c">0</span><span style="color:#ffffff">);</span>
<span style="color:#ffffff">}</span>
<span style="color:#ffffff">.</span><span style="color:#ffffff">button</span><span style="color:#ffffff">{</span><span style="color:#ffffff">
width</span><span style="color:#ffffff">:</span> <span style="color:#cd5c5c">50</span><span style="color:#ffffff">%;</span><span style="color:#ffffff">
font</span><span style="color:#ffffff">-</span><span style="color:#ffffff">size</span><span style="color:#ffffff">:</span> <span style="color:#cd5c5c">18px</span><span style="color:#ffffff">;</span><span style="color:#ffffff">
font</span><span style="color:#ffffff">-</span><span style="color:#ffffff">weight</span><span style="color:#ffffff">:</span><span style="color:#ffffff"> normal</span><span style="color:#ffffff">;</span><span style="color:#ffffff">
text</span><span style="color:#ffffff">-</span><span style="color:#ffffff">decoration</span><span style="color:#ffffff">:</span><span style="color:#ffffff"> none</span><span style="color:#ffffff">;</span><span style="color:#ffffff">
text</span><span style="color:#ffffff">-</span><span style="color:#ffffff">align</span><span style="color:#ffffff">:</span><span style="color:#ffffff"> center</span><span style="color:#ffffff">;</span><span style="color:#ffffff">
padding</span><span style="color:#ffffff">:</span> <span style="color:#ffffff">.</span><span style="color:#cd5c5c">5em</span> <span style="color:#cd5c5c">0em</span><span style="color:#ffffff">;</span><span style="color:#ffffff">
margin</span><span style="color:#ffffff">:</span> <span style="color:#ffffff">.</span><span style="color:#cd5c5c">5em</span> <span style="color:#f0e68c"><strong>auto</strong></span><span style="color:#ffffff">;</span><span style="color:#ffffff">
color</span><span style="color:#ffffff">:</span> <span style="color:#87ceeb">#333333;</span><span style="color:#ffffff">
background</span><span style="color:#ffffff">-</span><span style="color:#ffffff">color</span><span style="color:#ffffff">:</span> <span style="color:#87ceeb">#EEEEEE;</span><span style="color:#ffffff">
border</span><span style="color:#ffffff">:</span> <span style="color:#cd5c5c">1px</span><span style="color:#ffffff"> solid </span><span style="color:#87ceeb">#CCCCCC;</span>
<span style="color:#ffffff">-</span><span style="color:#ffffff">webkit</span><span style="color:#ffffff">-</span><span style="color:#ffffff">border</span><span style="color:#ffffff">-</span><span style="color:#ffffff">radius</span><span style="color:#ffffff">:</span> <span style="color:#cd5c5c">5px</span><span style="color:#ffffff">;</span><span style="color:#ffffff">
border</span><span style="color:#ffffff">-</span><span style="color:#ffffff">radius</span><span style="color:#ffffff">:</span> <span style="color:#cd5c5c">5px</span><span style="color:#ffffff">;</span>
<span style="color:#ffffff">}</span>
<span style="color:#ffffff">.</span><span style="color:#ffffff">button</span><span style="color:#ffffff">:</span><span style="color:#ffffff">active</span><span style="color:#ffffff">{</span><span style="color:#ffffff">
background</span><span style="color:#ffffff">-</span><span style="color:#ffffff">color</span><span style="color:#ffffff">:</span> <span style="color:#87ceeb">#CCCCCC;</span>
<span style="color:#ffffff">}</span>
<span style="color:#f0e68c"><strong></style></strong></span>
<span style="color:#f0e68c"><strong></head></strong></span>
<span style="color:#f0e68c"><strong><body></strong></span>
<span style="color:#f0e68c"><strong><div</strong></span> <span style="color:#bdb76b"><strong>style</strong></span><span style="color:#ffffff">=</span><span style="color:#ffa0a0">"</span><span style="color:#ffffff">width</span><span style="color:#ffffff">:</span><span style="color:#cd5c5c">100</span><span style="color:#ffffff">%;</span><span style="color:#ffffff">height</span><span style="color:#ffffff">:</span><span style="color:#cd5c5c">20</span><span style="color:#ffffff">%;</span><span style="color:#ffa0a0">"</span><span style="color:#f0e68c"><strong>></div></strong></span>
<span style="color:#f0e68c"><strong><svg</strong></span> <span style="color:#bdb76b"><strong>xmlns</strong></span><span style="color:#ffffff">=</span><span style="color:#ffa0a0">"http://www.w3.org/2000/svg"</span> <span style="color:#bdb76b"><strong>version</strong></span><span style="color:#ffffff">=</span><span style="color:#ffa0a0">"1.1"</span> <span style="color:#bdb76b"><strong>viewBox</strong></span><span style="color:#ffffff">=</span><span style="color:#ffa0a0">"0 0 512 512"</span> <span style="color:#bdb76b"><strong>style</strong></span><span style="color:#ffffff">=</span><span style="color:#ffa0a0">"</span><span style="color:#ffffff">height</span><span style="color:#ffffff">:</span><span style="color:#cd5c5c">20</span><span style="color:#ffffff">%;</span><span style="color:#ffa0a0">"</span><span style="color:#f0e68c"><strong>></strong></span>
<span style="color:#f0e68c"><strong><g</strong></span> <span style="color:#bdb76b"><strong>id</strong></span><span style="color:#ffffff">=</span><span style="color:#ffa0a0">"icomoon-ignore"</span><span style="color:#f0e68c"><strong>></strong></span>
<span style="color:#f0e68c"><strong><line</strong></span> <span style="color:#bdb76b"><strong>stroke-width</strong></span><span style="color:#ffffff">=</span><span style="color:#ffa0a0">"1"</span> <span style="color:#bdb76b"><strong>x1</strong></span><span style="color:#ffffff">=</span><span style="color:#ffa0a0">""</span> <span style="color:#bdb76b"><strong>y1</strong></span><span style="color:#ffffff">=</span><span style="color:#ffa0a0">""</span> <span style="color:#bdb76b"><strong>x2</strong></span><span style="color:#ffffff">=</span><span style="color:#ffa0a0">""</span> <span style="color:#bdb76b"><strong>y2</strong></span><span style="color:#ffffff">=</span><span style="color:#ffa0a0">""</span> <span style="color:#bdb76b"><strong>stroke</strong></span><span style="color:#ffffff">=</span><span style="color:#ffa0a0">"#449FDB"</span> <span style="color:#bdb76b"><strong>opacity</strong></span><span style="color:#ffffff">=</span><span style="color:#ffa0a0">""</span><span style="color:#f0e68c"><strong>></line></strong></span>
<span style="color:#f0e68c"><strong></g></strong></span>
<span style="color:#f0e68c"><strong><path</strong></span> <span style="color:#bdb76b"><strong>d</strong></span><span style="color:#ffffff">=</span><span style="color:#ffa0a0">"M256 0c-141.385 0-256 114.615-256 256s114.615 256 256 256 256-114.615 256-256-114.615-256-256-256zM352 128c17.673 0 32 14.327 32 32s-14.327 32-32 32-32-14.327-32-32 14.327-32 32-32zM160 128c17.673 0 32 14.327 32 32s-14.327 32-32 32-32-14.327-32-32 14.327-32 32-32zM352.049 390.37c-19.587-32.574-55.272-54.37-96.049-54.37s-76.462 21.796-96.049 54.37l-41.164-24.698c27.98-46.535 78.958-77.672 137.213-77.672s109.232 31.137 137.213 77.672l-41.164 24.698z"</span> <span style="color:#bdb76b"><strong>fill</strong></span><span style="color:#ffffff">=</span><span style="color:#ffa0a0">"#666666"</span><span style="color:#f0e68c"><strong>></path></strong></span>
<span style="color:#f0e68c"><strong></svg></strong></span>
<span style="color:#f0e68c"><strong><p</strong></span> <span style="color:#bdb76b"><strong>style</strong></span><span style="color:#ffffff">=</span><span style="color:#ffa0a0">"</span><span style="color:#ffffff">font</span><span style="color:#ffffff">-</span><span style="color:#ffffff">size</span><span style="color:#ffffff">:</span><span style="color:#cd5c5c">18px</span><span style="color:#ffffff">;</span><span style="color:#ffffff">font</span><span style="color:#ffffff">-</span><span style="color:#ffffff">weight</span><span style="color:#ffffff">:</span><span style="color:#ffffff">bolder</span><span style="color:#ffffff">;</span><span style="color:#ffa0a0">"</span><span style="color:#f0e68c"><strong>></strong></span><span style="color:#ffffff">We're sorry ...</span><span style="color:#f0e68c"><strong></p></strong></span>
<span style="color:#f0e68c"><strong><p</strong></span> <span style="color:#bdb76b"><strong>id</strong></span><span style="color:#ffffff">=</span><span style="color:#ffa0a0">"info"</span> <span style="color:#bdb76b"><strong>style</strong></span><span style="color:#ffffff">=</span><span style="color:#ffa0a0">"</span><span style="color:#ffffff">font</span><span style="color:#ffffff">-</span><span style="color:#ffffff">size</span><span style="color:#ffffff">:</span><span style="color:#cd5c5c">12px</span><span style="color:#ffffff">;</span><span style="color:#ffa0a0">"</span><span style="color:#f0e68c"><strong>></p></strong></span>
<span style="color:#87ceeb"><!--<div class="button" onclick="history.back()">Retry</div>--></span>
<span style="color:#f0e68c"><strong><div</strong></span> <span style="color:#bdb76b"><strong>class</strong></span><span style="color:#ffffff">=</span><span style="color:#ffa0a0">"button"</span> <span style="color:#bdb76b"><strong>onclick</strong></span><span style="color:#ffffff">=</span><span style="color:#ffa0a0">"</span><span style="color:#f0e68c"><strong>if</strong></span><span style="color:#ffffff">(</span><span style="color:#ffffff">history</span><span style="color:#ffffff">.</span><span style="color:#ffffff">length </span><span style="color:#ffffff">==</span> <span style="color:#cd5c5c">1</span><span style="color:#ffffff">){</span><span style="color:#ffffff">ws</span><span style="color:#ffffff">.</span><span style="color:#ffffff">close</span><span style="color:#ffffff">();}</span><span style="color:#f0e68c"><strong>else</strong></span><span style="color:#ffffff">{</span><span style="color:#ffffff">ws</span><span style="color:#ffffff">.</span><span style="color:#ffffff">back</span><span style="color:#ffffff">();</span><span style="color:#ffffff">ws</span><span style="color:#ffffff">.</span><span style="color:#ffffff">back</span><span style="color:#ffffff">();}</span><span style="color:#ffa0a0">"</span><span style="color:#f0e68c"><strong>></strong></span><span style="color:#ffffff">Back</span><span style="color:#f0e68c"><strong></div></strong></span>
<span style="color:#f0e68c"><strong><div</strong></span> <span style="color:#bdb76b"><strong>class</strong></span><span style="color:#ffffff">=</span><span style="color:#ffa0a0">"button"</span> <span style="color:#bdb76b"><strong>onclick</strong></span><span style="color:#ffffff">=</span><span style="color:#ffa0a0">"</span><span style="color:#ffffff">ws</span><span style="color:#ffffff">.</span><span style="color:#ffffff">close</span><span style="color:#ffffff">()</span><span style="color:#ffa0a0">"</span><span style="color:#f0e68c"><strong>></strong></span><span style="color:#ffffff">Close</span><span style="color:#f0e68c"><strong></div></strong></span>
<span style="color:#f0e68c"><strong></body></strong></span>
<span style="color:#f0e68c"><strong></html></strong></span>
</code></span></span></code></pre>
<p style="margin-left:0;"><span style="color:#474747;"><span style="background-color:#f6f4f2;"><ahref="https://uniapp.dcloud.io/use-html5plus">uni-app使用plus注意事项</a></span></span></p>
<h1 style="margin-left:0;"><span style="color:#474747;"><span style="background-color:#f6f4f2;"><!--LINK#0_30-->"background"</span></span></h1>
<p style="margin-left:0;"><span style="color:#474747;"><span style="background-color:#f6f4f2;">应用切换到后台运行事件</span></span></p>
<pre class="has" style="margin-left:0;"><code class="language-prettyprint"><span style="background-color:#333333"><span style="color:#474747"><code><span style="color:#ffffff">
document</span><span style="color:#ffffff">.</span><span style="color:#ffffff">addEventListener</span><span style="color:#ffffff">(</span><span style="color:#ffa0a0">"background"</span><span style="color:#ffffff">,</span> <span style="color:#f0e68c"><strong>function</strong></span><span style="color:#ffffff">(){</span>
<span style="color:#87ceeb">//应用切换到后台运行</span>
<span style="color:#ffffff">},</span> <span style="color:#f0e68c"><strong>false</strong></span><span style="color:#ffffff">);</span>
</code></span></span></code></pre>
<h2 style="margin-left:.8em;"><span style="color:#f13a0e;"><strong><span style="background-color:#f6f4f2;">说明:</span></strong></span></h2>
<p style="margin-left:0;"><span style="color:#474747;"><span style="background-color:#f6f4f2;">String 类型</span></span></p>
<p style="margin-left:0;"><span style="color:#474747;"><span style="background-color:#f6f4f2;">在多应用运行环境(如流应用)中,启动一个新应用时,之前运行的应用将会自动切换到后台运行。 切换到后台运行的应用将会触发此事件。 注意:此事件可能早于"plusready"事件触发,如果在回调事件中需要调用5+API,建议在plusready回调事件触发后再监听。</span></span></p>
<h2 style="margin-left:.8em;"><span style="color:#f13a0e;"><strong><span style="background-color:#f6f4f2;">示例:</span></strong></span></h2>
<pre class="has" style="margin-left:0;"><code class="language-prettyprint"><span style="background-color:#333333"><span style="color:#474747"><code>
<span style="color:#cccccc"><!DOCTYPE html></span>
<span style="color:#f0e68c"><strong><html></strong></span>
<span style="color:#f0e68c"><strong><head></strong></span>
<span style="color:#f0e68c"><strong><meta</strong></span> <span style="color:#bdb76b"><strong>charset</strong></span><span style="color:#ffffff">=</span><span style="color:#ffa0a0">"utf-8"</span><span style="color:#f0e68c"><strong>></strong></span>
<span style="color:#f0e68c"><strong><title></strong></span><span style="color:#ffffff">Events Example</span><span style="color:#f0e68c"><strong></title></strong></span>
<span style="color:#f0e68c"><strong><script</strong></span> <span style="color:#bdb76b"><strong>type</strong></span><span style="color:#ffffff">=</span><span style="color:#ffa0a0">"text/javascript"</span> <span style="color:#f0e68c"><strong>></strong></span>
<span style="color:#87ceeb">// 扩展API加载完毕后调用onPlusReady回调函数 </span><span style="color:#ffffff">
document</span><span style="color:#ffffff">.</span><span style="color:#ffffff">addEventListener</span><span style="color:#ffffff">(</span><span style="color:#ffa0a0">"plusready"</span><span style="color:#ffffff">,</span><span style="color:#ffffff"> onPlusReady</span><span style="color:#ffffff">,</span> <span style="color:#f0e68c"><strong>false</strong></span><span style="color:#ffffff">);</span>
<span style="color:#f0e68c"><strong>function</strong></span><span style="color:#ffffff"> onPlusReady</span><span style="color:#ffffff">(){</span><span style="color:#ffffff">
document</span><span style="color:#ffffff">.</span><span style="color:#ffffff">addEventListener</span><span style="color:#ffffff">(</span><span style="color:#ffa0a0">"background"</span><span style="color:#ffffff">,</span><span style="color:#ffffff"> onAppBackground</span><span style="color:#ffffff">,</span> <span style="color:#f0e68c"><strong>false</strong></span><span style="color:#ffffff">);</span>
<span style="color:#ffffff">}</span>
<span style="color:#f0e68c"><strong>function</strong></span><span style="color:#ffffff"> onAppBackground</span><span style="color:#ffffff">(){</span><span style="color:#ffffff">
console</span><span style="color:#ffffff">.</span><span style="color:#ffffff">log</span><span style="color:#ffffff">(</span><span style="color:#ffa0a0">"Application background!"</span><span style="color:#ffffff">);</span>
<span style="color:#ffffff">}</span>
<span style="color:#f0e68c"><strong></script></strong></span>
<span style="color:#f0e68c"><strong></head></strong></span>
<span style="color:#f0e68c"><strong><body</strong></span> <span style="color:#f0e68c"><strong>></strong></span>
<span style="color:#f0e68c"><strong></body></strong></span>
<span style="color:#f0e68c"><strong></html></strong></span>
</code></span></span></code></pre>
<p style="margin-left:0;"><span style="color:#474747;"><span style="background-color:#f6f4f2;"><ahref="https://uniapp.dcloud.io/use-html5plus">uni-app使用plus注意事项</a></span></span></p>
<h1 style="margin-left:0;"><span style="color:#474747;"><span style="background-color:#f6f4f2;"><!--LINK#0_32-->"foreground"</span></span></h1>
<p style="margin-left:0;"><span style="color:#474747;"><span style="background-color:#f6f4f2;">应用切换到前台运行事件</span></span></p>
<pre class="has" style="margin-left:0;"><code class="language-prettyprint"><span style="background-color:#333333"><span style="color:#474747"><code><span style="color:#ffffff">
document</span><span style="color:#ffffff">.</span><span style="color:#ffffff">addEventListener</span><span style="color:#ffffff">(</span><span style="color:#ffa0a0">"foreground"</span><span style="color:#ffffff">,</span> <span style="color:#f0e68c"><strong>function</strong></span><span style="color:#ffffff">(</span><span style="color:#ffffff">e</span><span style="color:#ffffff">){</span>
<span style="color:#87ceeb">//应用切换到前台运行</span>
<span style="color:#ffffff">},</span> <span style="color:#f0e68c"><strong>false</strong></span><span style="color:#ffffff">);</span>
</code></span></span></code></pre>
<h2 style="margin-left:.8em;"><span style="color:#f13a0e;"><strong><span style="background-color:#f6f4f2;">说明:</span></strong></span></h2>
<p style="margin-left:0;"><span style="color:#474747;"><span style="background-color:#f6f4f2;">String 类型</span></span></p>
<p style="margin-left:0;"><span style="color:#474747;"><span style="background-color:#f6f4f2;">在多应用运行环境(如流应用)中,应用切换到后台运行后再次被启动时,不会创建新的应用实例,而是将后台应用激活到前台运行。 此时切换到前台运行的应用将会触发foreground事件。 回调函数原型为void onForeground(e){}其中e.active表明激活应用到前台来源,可取值:"default"-默认激活方式,通常表示通过应用列表启动激活,或者关闭前一个应用后自动激活等;"stream"-通过流应用api(plus.stream.open)激活;"scheme"-通过urlscheme方式触发激活; "push"-通过点击系统通知方式触发激活; "barcode"-通过二维码扫描激活; "myapp"-通过应用收藏列表([流应用]独立App中"我的"列表)触发激活。</span></span></p>
<h2 style="margin-left:.8em;"><span style="color:#f13a0e;"><strong><span style="background-color:#f6f4f2;">示例:</span></strong></span></h2>
<pre class="has" style="margin-left:0;"><code class="language-prettyprint"><span style="background-color:#333333"><span style="color:#474747"><code>
<span style="color:#cccccc"><!DOCTYPE html></span>
<span style="color:#f0e68c"><strong><html></strong></span>
<span style="color:#f0e68c"><strong><head></strong></span>
<span style="color:#f0e68c"><strong><meta</strong></span> <span style="color:#bdb76b"><strong>charset</strong></span><span style="color:#ffffff">=</span><span style="color:#ffa0a0">"utf-8"</span><span style="color:#f0e68c"><strong>></strong></span>
<span style="color:#f0e68c"><strong><title></strong></span><span style="color:#ffffff">Events Example</span><span style="color:#f0e68c"><strong></title></strong></span>
<span style="color:#f0e68c"><strong><script</strong></span> <span style="color:#bdb76b"><strong>type</strong></span><span style="color:#ffffff">=</span><span style="color:#ffa0a0">"text/javascript"</span> <span style="color:#f0e68c"><strong>></strong></span>
<span style="color:#87ceeb">// 扩展API加载完毕后调用onPlusReady回调函数 </span><span style="color:#ffffff">
document</span><span style="color:#ffffff">.</span><span style="color:#ffffff">addEventListener</span><span style="color:#ffffff">(</span><span style="color:#ffa0a0">"plusready"</span><span style="color:#ffffff">,</span><span style="color:#ffffff"> onPlusReady</span><span style="color:#ffffff">,</span> <span style="color:#f0e68c"><strong>false</strong></span><span style="color:#ffffff">);</span>
<span style="color:#f0e68c"><strong>function</strong></span><span style="color:#ffffff"> onPlusReady</span><span style="color:#ffffff">(){</span><span style="color:#ffffff">
document</span><span style="color:#ffffff">.</span><span style="color:#ffffff">addEventListener</span><span style="color:#ffffff">(</span><span style="color:#ffa0a0">"foreground"</span><span style="color:#ffffff">,</span><span style="color:#ffffff"> onAppForeground</span><span style="color:#ffffff">,</span> <span style="color:#f0e68c"><strong>false</strong></span><span style="color:#ffffff">);</span>
<span style="color:#ffffff">}</span>
<span style="color:#f0e68c"><strong>function</strong></span><span style="color:#ffffff"> onAppForeground</span><span style="color:#ffffff">(</span><span style="color:#ffffff">e</span><span style="color:#ffffff">){</span><span style="color:#ffffff">
console</span><span style="color:#ffffff">.</span><span style="color:#ffffff">log</span><span style="color:#ffffff">(</span><span style="color:#ffa0a0">"Application foreground!"</span><span style="color:#ffffff">);</span>
<span style="color:#f0e68c"><strong>var</strong></span><span style="color:#ffffff"> activeType </span><span style="color:#ffffff">=</span><span style="color:#ffffff"> e</span><span style="color:#ffffff">.</span><span style="color:#ffffff">active</span><span style="color:#ffffff">;</span> <span style="color:#87ceeb">// 获取激活到前台来源</span>
<span style="color:#ffffff">}</span>
<span style="color:#f0e68c"><strong></script></strong></span>
<span style="color:#f0e68c"><strong></head></strong></span>
<span style="color:#f0e68c"><strong><body</strong></span> <span style="color:#f0e68c"><strong>></strong></span>
<span style="color:#f0e68c"><strong></body></strong></span>
<span style="color:#f0e68c"><strong></html></strong></span>
</code></span></span></code></pre>
<p style="margin-left:0;"><span style="color:#474747;"><span style="background-color:#f6f4f2;"><ahref="https://uniapp.dcloud.io/use-html5plus">uni-app使用plus注意事项</a></span></span></p>
<h1 style="margin-left:0;"><span style="color:#474747;"><span style="background-color:#f6f4f2;"><!--LINK#0_34-->"trimmemory"</span></span></h1>
<p style="margin-left:0;"><span style="color:#474747;"><span style="background-color:#f6f4f2;">应用需要清理内存事件</span></span></p>
<pre class="has" style="margin-left:0;"><code class="language-prettyprint"><span style="background-color:#333333"><span style="color:#474747"><code><span style="color:#ffffff">
document</span><span style="color:#ffffff">.</span><span style="color:#ffffff">addEventListener</span><span style="color:#ffffff">(</span><span style="color:#ffa0a0">"trimmemory"</span><span style="color:#ffffff">,</span> <span style="color:#f0e68c"><strong>function</strong></span><span style="color:#ffffff">(){</span>
<span style="color:#87ceeb">//应用需要清理内存</span>
<span style="color:#ffffff">},</span> <span style="color:#f0e68c"><strong>false</strong></span><span style="color:#ffffff">);</span>
</code></span></span></code></pre>
<h2 style="margin-left:.8em;"><span style="color:#f13a0e;"><strong><span style="background-color:#f6f4f2;">说明:</span></strong></span></h2>
<p style="margin-left:0;"><span style="color:#474747;"><span style="background-color:#f6f4f2;">String 类型</span></span></p>
<p style="margin-left:0;"><span style="color:#474747;"><span style="background-color:#f6f4f2;">在多应用运行环境(如流应用)中,可同时运行多个应用,当运行过多应用时会导致内存占用过多的情况,此时切换到后台运行的应用会收到清理内存事件。 此时应用应该释放资源来减少内存的使用(如关闭非必要的Webview窗口等)。</span></span></p>
<h2 style="margin-left:.8em;"><span style="color:#f13a0e;"><strong><span style="background-color:#f6f4f2;">示例:</span></strong></span></h2>
<pre class="has" style="margin-left:0;"><code class="language-prettyprint"><span style="background-color:#333333"><span style="color:#474747"><code>
<span style="color:#cccccc"><!DOCTYPE html></span>
<span style="color:#f0e68c"><strong><html></strong></span>
<span style="color:#f0e68c"><strong><head></strong></span>
<span style="color:#f0e68c"><strong><meta</strong></span> <span style="color:#bdb76b"><strong>charset</strong></span><span style="color:#ffffff">=</span><span style="color:#ffa0a0">"utf-8"</span><span style="color:#f0e68c"><strong>></strong></span>
<span style="color:#f0e68c"><strong><title></strong></span><span style="color:#ffffff">Events Example</span><span style="color:#f0e68c"><strong></title></strong></span>
<span style="color:#f0e68c"><strong><script</strong></span> <span style="color:#bdb76b"><strong>type</strong></span><span style="color:#ffffff">=</span><span style="color:#ffa0a0">"text/javascript"</span> <span style="color:#f0e68c"><strong>></strong></span>
<span style="color:#87ceeb">// 扩展API加载完毕后调用onPlusReady回调函数 </span><span style="color:#ffffff">
document</span><span style="color:#ffffff">.</span><span style="color:#ffffff">addEventListener</span><span style="color:#ffffff">(</span><span style="color:#ffa0a0">"plusready"</span><span style="color:#ffffff">,</span><span style="color:#ffffff"> onPlusReady</span><span style="color:#ffffff">,</span> <span style="color:#f0e68c"><strong>false</strong></span><span style="color:#ffffff">);</span>
<span style="color:#f0e68c"><strong>function</strong></span><span style="color:#ffffff"> onPlusReady</span><span style="color:#ffffff">(){</span><span style="color:#ffffff">
document</span><span style="color:#ffffff">.</span><span style="color:#ffffff">addEventListener</span><span style="color:#ffffff">(</span><span style="color:#ffa0a0">"trimmemory"</span><span style="color:#ffffff">,</span><span style="color:#ffffff"> onAppTrimMemory</span><span style="color:#ffffff">,</span> <span style="color:#f0e68c"><strong>false</strong></span><span style="color:#ffffff">);</span>
<span style="color:#ffffff">}</span>
<span style="color:#f0e68c"><strong>function</strong></span><span style="color:#ffffff"> onAppTrimMemory</span><span style="color:#ffffff">(){</span><span style="color:#ffffff">
console</span><span style="color:#ffffff">.</span><span style="color:#ffffff">log</span><span style="color:#ffffff">(</span><span style="color:#ffa0a0">"Trim Memory!"</span><span style="color:#ffffff">);</span>
<span style="color:#ffffff">}</span>
<span style="color:#f0e68c"><strong></script></strong></span>
<span style="color:#f0e68c"><strong></head></strong></span>
<span style="color:#f0e68c"><strong><body</strong></span> <span style="color:#f0e68c"><strong>></strong></span>
<span style="color:#f0e68c"><strong></body></strong></span>
<span style="color:#f0e68c"><strong></html></strong></span>
</code></span></span></code></pre>
<p style="margin-left:0;"><span style="color:#474747;"><span style="background-color:#f6f4f2;"><ahref="https://uniapp.dcloud.io/use-html5plus">uni-app使用plus注意事项</a></span></span></p>
<h1 style="margin-left:0;"><span style="color:#474747;"><span style="background-color:#f6f4f2;"><!--LINK#0_36-->"splashclosed"</span></span></h1>
<p style="margin-left:0;"><span style="color:#474747;"><span style="background-color:#f6f4f2;">应用启动界面已关闭事件</span></span></p>
<pre class="has" style="margin-left:0;"><code class="language-prettyprint"><span style="background-color:#333333"><span style="color:#474747"><code><span style="color:#ffffff">
document</span><span style="color:#ffffff">.</span><span style="color:#ffffff">addEventListener</span><span style="color:#ffffff">(</span><span style="color:#ffa0a0">"splashclosed"</span><span style="color:#ffffff">,</span> <span style="color:#f0e68c"><strong>function</strong></span><span style="color:#ffffff">(){</span>
<span style="color:#ffffff">},</span> <span style="color:#f0e68c"><strong>false</strong></span><span style="color:#ffffff">);</span>
</code></span></span></code></pre>
<h2 style="margin-left:.8em;"><span style="color:#f13a0e;"><strong><span style="background-color:#f6f4f2;">说明:</span></strong></span></h2>
<p style="margin-left:0;"><span style="color:#474747;"><span style="background-color:#f6f4f2;">String 类型</span></span></p>
<p style="margin-left:0;"><span style="color:#474747;"><span style="background-color:#f6f4f2;">应用启动后关闭启动界面时触发,不管是应用自动关闭还是调用plus.navigator.closeSplashscreen方法,都会触发此事件。</span></span></p>
<h2 style="margin-left:.8em;"><span style="color:#f13a0e;"><strong><span style="background-color:#f6f4f2;">示例:</span></strong></span></h2>
<pre class="has" style="margin-left:0;"><code class="language-prettyprint"><span style="background-color:#333333"><span style="color:#474747"><code>
<span style="color:#cccccc"><!DOCTYPE html></span>
<span style="color:#f0e68c"><strong><html></strong></span>
<span style="color:#f0e68c"><strong><head></strong></span>
<span style="color:#f0e68c"><strong><meta</strong></span> <span style="color:#bdb76b"><strong>charset</strong></span><span style="color:#ffffff">=</span><span style="color:#ffa0a0">"utf-8"</span><span style="color:#f0e68c"><strong>></strong></span>
<span style="color:#f0e68c"><strong><title></strong></span><span style="color:#ffffff">Events Example</span><span style="color:#f0e68c"><strong></title></strong></span>
<span style="color:#f0e68c"><strong><script</strong></span> <span style="color:#bdb76b"><strong>type</strong></span><span style="color:#ffffff">=</span><span style="color:#ffa0a0">"text/javascript"</span> <span style="color:#f0e68c"><strong>></strong></span>
<span style="color:#87ceeb">// 扩展API加载完毕后调用onPlusReady回调函数 </span><span style="color:#ffffff">
document</span><span style="color:#ffffff">.</span><span style="color:#ffffff">addEventListener</span><span style="color:#ffffff">(</span><span style="color:#ffa0a0">"plusready"</span><span style="color:#ffffff">,</span><span style="color:#ffffff"> onPlusReady</span><span style="color:#ffffff">,</span> <span style="color:#f0e68c"><strong>false</strong></span><span style="color:#ffffff">);</span>
<span style="color:#f0e68c"><strong>function</strong></span><span style="color:#ffffff"> onPlusReady</span><span style="color:#ffffff">(){</span><span style="color:#ffffff">
document</span><span style="color:#ffffff">.</span><span style="color:#ffffff">addEventListener</span><span style="color:#ffffff">(</span><span style="color:#ffa0a0">"splashclosed"</span><span style="color:#ffffff">,</span><span style="color:#ffffff"> onSplashClosed</span><span style="color:#ffffff">,</span> <span style="color:#f0e68c"><strong>false</strong></span><span style="color:#ffffff">);</span>
<span style="color:#ffffff">}</span>
<span style="color:#f0e68c"><strong>function</strong></span><span style="color:#ffffff"> onSplashClosed</span><span style="color:#ffffff">(){</span><span style="color:#ffffff">
console</span><span style="color:#ffffff">.</span><span style="color:#ffffff">log</span><span style="color:#ffffff">(</span><span style="color:#ffa0a0">"Splash closed!"</span><span style="color:#ffffff">);</span>
<span style="color:#ffffff">}</span>
<span style="color:#f0e68c"><strong></script></strong></span>
<span style="color:#f0e68c"><strong></head></strong></span>
<span style="color:#f0e68c"><strong><body</strong></span> <span style="color:#f0e68c"><strong>></strong></span>
<span style="color:#f0e68c"><strong></body></strong></span>
<span style="color:#f0e68c"><strong></html></strong></span>
</code></span></span></code></pre>
<p style="margin-left:0;"><span style="color:#474747;"><span style="background-color:#f6f4f2;"><ahref="https://uniapp.dcloud.io/use-html5plus">uni-app使用plus注意事项</a></span></span></p>
<h1 style="margin-left:0;"><span style="color:#474747;"><span style="background-color:#f6f4f2;"><!--LINK#0_38-->"keyboardchange"</span></span></h1>
<p style="margin-left:0;"><span style="color:#474747;"><span style="background-color:#f6f4f2;">软键盘变化事件</span></span></p>
<pre class="has" style="margin-left:0;"><code class="language-prettyprint"><span style="background-color:#333333"><span style="color:#474747"><code><span style="color:#ffffff">
document</span><span style="color:#ffffff">.</span><span style="color:#ffffff">addEventListener</span><span style="color:#ffffff">(</span><span style="color:#ffa0a0">"keyboardchange"</span><span style="color:#ffffff">,</span><span style="color:#ffffff"> keyboardChangeCallback</span><span style="color:#ffffff">,</span><span style="color:#ffffff"> capture</span><span style="color:#ffffff">);</span>
</code></span></span></code></pre>
<h2 style="margin-left:.8em;"><span style="color:#f13a0e;"><strong><span style="background-color:#f6f4f2;">说明:</span></strong></span></h2>
<p style="margin-left:0;"><span style="color:#474747;"><span style="background-color:#f6f4f2;">String 类型</span></span></p>
<p style="margin-left:0;"><span style="color:#474747;"><span style="background-color:#f6f4f2;">但软键盘打开或关闭时触发,并在回到参数event中height属性表示软键盘的高度。 height属性值大于0表示打开软键盘,height属性值为0表示关闭软键盘。</span></span></p>
<h2 style="margin-left:.8em;"><span style="color:#f13a0e;"><strong><span style="background-color:#f6f4f2;">示例:</span></strong></span></h2>
<pre class="has" style="margin-left:0;"><code class="language-prettyprint"><span style="background-color:#333333"><span style="color:#474747"><code>
<span style="color:#cccccc"><!DOCTYPE html></span>
<span style="color:#f0e68c"><strong><html></strong></span>
<span style="color:#f0e68c"><strong><head></strong></span>
<span style="color:#f0e68c"><strong><meta</strong></span> <span style="color:#bdb76b"><strong>charset</strong></span><span style="color:#ffffff">=</span><span style="color:#ffa0a0">"utf-8"</span><span style="color:#f0e68c"><strong>></strong></span>
<span style="color:#f0e68c"><strong><title></strong></span><span style="color:#ffffff">Events Example</span><span style="color:#f0e68c"><strong></title></strong></span>
<span style="color:#f0e68c"><strong><script</strong></span> <span style="color:#bdb76b"><strong>type</strong></span><span style="color:#ffffff">=</span><span style="color:#ffa0a0">"text/javascript"</span> <span style="color:#f0e68c"><strong>></strong></span>
<span style="color:#87ceeb">// 扩展API加载完毕后调用onPlusReady回调函数 </span><span style="color:#ffffff">
document</span><span style="color:#ffffff">.</span><span style="color:#ffffff">addEventListener</span><span style="color:#ffffff">(</span><span style="color:#ffa0a0">"plusready"</span><span style="color:#ffffff">,</span><span style="color:#ffffff"> onPlusReady</span><span style="color:#ffffff">,</span> <span style="color:#f0e68c"><strong>false</strong></span><span style="color:#ffffff">);</span>
<span style="color:#f0e68c"><strong>function</strong></span><span style="color:#ffffff"> onPlusReady</span><span style="color:#ffffff">(){</span><span style="color:#ffffff">
document</span><span style="color:#ffffff">.</span><span style="color:#ffffff">addEventListener</span><span style="color:#ffffff">(</span><span style="color:#ffa0a0">"keyboardchange"</span><span style="color:#ffffff">,</span><span style="color:#ffffff"> onKeyboardChange</span><span style="color:#ffffff">,</span> <span style="color:#f0e68c"><strong>false</strong></span><span style="color:#ffffff">);</span>
<span style="color:#ffffff">}</span>
<span style="color:#f0e68c"><strong>function</strong></span><span style="color:#ffffff"> onKeyboardChange</span><span style="color:#ffffff">(</span><span style="color:#ffffff">e</span><span style="color:#ffffff">){</span>
<span style="color:#f0e68c"><strong>var</strong></span><span style="color:#ffffff"> height </span><span style="color:#ffffff">=</span><span style="color:#ffffff"> e</span><span style="color:#ffffff">.</span><span style="color:#ffffff">height</span><span style="color:#ffffff">;</span> <span style="color:#87ceeb">// 键盘高度</span>
<span style="color:#f0e68c"><strong>if</strong></span><span style="color:#ffffff">(</span><span style="color:#ffffff">height </span><span style="color:#ffffff">></span> <span style="color:#cd5c5c">0</span><span style="color:#ffffff">){</span><span style="color:#ffffff">
console</span><span style="color:#ffffff">.</span><span style="color:#ffffff">log</span><span style="color:#ffffff">(</span><span style="color:#ffa0a0">'键盘显示'</span><span style="color:#ffffff">);</span>
<span style="color:#ffffff">}</span><span style="color:#f0e68c"><strong>else</strong></span><span style="color:#ffffff">{</span><span style="color:#ffffff">
console</span><span style="color:#ffffff">.</span><span style="color:#ffffff">log</span><span style="color:#ffffff">(</span><span style="color:#ffa0a0">'键盘隐藏'</span><span style="color:#ffffff">);</span>
<span style="color:#ffffff">}</span>
<span style="color:#ffffff">}</span>
<span style="color:#f0e68c"><strong></script></strong></span>
<span style="color:#f0e68c"><strong></head></strong></span>
<span style="color:#f0e68c"><strong><body</strong></span> <span style="color:#f0e68c"><strong>></strong></span>
<span style="color:#f0e68c"><strong></body></strong></span>
<span style="color:#f0e68c"><strong></html></strong></span>
</code></span></span></code></pre>
<p style="margin-left:0;"><span style="color:#474747;"><span style="background-color:#f6f4f2;"><ahref="https://uniapp.dcloud.io/use-html5plus">uni-app使用plus注意事项</a></span></span></p>
<h1 style="margin-left:0;"><span style="color:#474747;"><span style="background-color:#f6f4f2;"><!--LINK#0_40-->"uistylechange"</span></span></h1>
<p style="margin-left:0;"><span style="color:#474747;"><span style="background-color:#f6f4f2;">系统外观样式变化事件</span></span></p>
<pre class="has" style="margin-left:0;"><code class="language-prettyprint"><span style="background-color:#333333"><span style="color:#474747"><code><span style="color:#ffffff">
document</span><span style="color:#ffffff">.</span><span style="color:#ffffff">addEventListener</span><span style="color:#ffffff">(</span><span style="color:#ffa0a0">"uistylechange"</span><span style="color:#ffffff">,</span><span style="color:#ffffff"> uiStyleChangeEvent</span><span style="color:#ffffff">,</span><span style="color:#ffffff"> capture</span><span style="color:#ffffff">);</span>
</code></span></span></code></pre>
<h2 style="margin-left:.8em;"><span style="color:#f13a0e;"><strong><span style="background-color:#f6f4f2;">说明:</span></strong></span></h2>
<p style="margin-left:0;"><span style="color:#474747;"><span style="background-color:#f6f4f2;">String 类型</span></span></p>
<p style="margin-left:0;"><span style="color:#474747;"><span style="background-color:#f6f4f2;">系统外观样式切换(设置或关闭暗黑模式)时触发。 可通过<ahref="https://www.html5plus.org/doc/zh_cn/navigator.html#plus.navigator.getUiStyle">plus.navigator.getUiStyle()</a>获取当前设置的外观样式。 HBuilderX2.6.3+版本支持,iOS平台适配暗黑模式参考:<ahref="https://ask.dcloud.net.cn/article/36995">iOS13适配暗黑模式/夜间模式/深色模式/暗黑主题(DarkMode) - DCloud问答</a>。</span></span></p>
<h2 style="margin-left:.8em;"><span style="color:#f13a0e;"><strong><span style="background-color:#f6f4f2;">示例:</span></strong></span></h2>
<pre class="has" style="margin-left:0;"><code class="language-prettyprint"><span style="background-color:#333333"><span style="color:#474747"><code>
<span style="color:#cccccc"><!DOCTYPE html></span>
<span style="color:#f0e68c"><strong><html></strong></span>
<span style="color:#f0e68c"><strong><head></strong></span>
<span style="color:#f0e68c"><strong><meta</strong></span> <span style="color:#bdb76b"><strong>charset</strong></span><span style="color:#ffffff">=</span><span style="color:#ffa0a0">"utf-8"</span><span style="color:#f0e68c"><strong>></strong></span>
<span style="color:#f0e68c"><strong><title></strong></span><span style="color:#ffffff">Events Example</span><span style="color:#f0e68c"><strong></title></strong></span>
<span style="color:#f0e68c"><strong><script</strong></span> <span style="color:#bdb76b"><strong>type</strong></span><span style="color:#ffffff">=</span><span style="color:#ffa0a0">"text/javascript"</span> <span style="color:#f0e68c"><strong>></strong></span>
<span style="color:#87ceeb">// 监听uistylechange消息</span><span style="color:#ffffff">
document</span><span style="color:#ffffff">.</span><span style="color:#ffffff">addEventListener</span><span style="color:#ffffff">(</span><span style="color:#ffa0a0">"uistylechange"</span><span style="color:#ffffff">,</span> <span style="color:#f0e68c"><strong>function</strong></span><span style="color:#ffffff">(){</span>
<span style="color:#f0e68c"><strong>var</strong></span><span style="color:#ffffff"> style </span><span style="color:#ffffff">=</span><span style="color:#ffffff"> plus</span><span style="color:#ffffff">.</span><span style="color:#ffffff">navigator</span><span style="color:#ffffff">.</span><span style="color:#ffffff">getUiStyle</span><span style="color:#ffffff">();</span><span style="color:#ffffff">
console</span><span style="color:#ffffff">.</span><span style="color:#ffffff">log</span><span style="color:#ffffff">(</span><span style="color:#ffa0a0">"current ui style: "</span><span style="color:#ffffff">+</span><span style="color:#ffffff">style</span><span style="color:#ffffff">);</span>
<span style="color:#ffffff">},</span> <span style="color:#f0e68c"><strong>false</strong></span><span style="color:#ffffff">);</span>
<span style="color:#f0e68c"><strong></script></strong></span>
<span style="color:#f0e68c"><strong></head></strong></span>
<span style="color:#f0e68c"><strong><body</strong></span> <span style="color:#f0e68c"><strong>></strong></span>
<span style="color:#f0e68c"><strong></body></strong></span>
<span style="color:#f0e68c"><strong></html></strong></span>
</code></span></span></code></pre>
<p style="margin-left:0;"><span style="color:#474747;"><span style="background-color:#f6f4f2;"><ahref="https://uniapp.dcloud.io/use-html5plus">uni-app使用plus注意事项</a></span></span></p>
<h1 style="margin-left:0;"><span style="color:#474747;"><span style="background-color:#f6f4f2;"><!--LINK#0_44-->addEventListener</span></span></h1>
<p style="margin-left:0;"><span style="color:#474747;"><span style="background-color:#f6f4f2;">添加事件监听函数</span></span></p>
<pre class="has" style="margin-left:0;"><code class="language-prettyprint"><span style="background-color:#333333"><span style="color:#474747"><code>
<span style="color:#f0e68c"><strong>void</strong></span><span style="color:#ffffff"> document</span><span style="color:#ffffff">.</span><span style="color:#ffffff">addEventListener</span><span style="color:#ffffff">(</span><span style="color:#f0e68c"><strong>event</strong></span><span style="color:#ffffff">,</span><span style="color:#ffffff"> callback</span><span style="color:#ffffff">,</span><span style="color:#ffffff"> capture</span><span style="color:#ffffff">);</span>
</code></span></span></code></pre>
<h2 style="margin-left:.8em;"><span style="color:#f13a0e;"><strong><span style="background-color:#f6f4f2;">说明:</span></strong></span></h2>
<p style="margin-left:0;"><span style="color:#474747;"><span style="background-color:#f6f4f2;">通过Html中标准document对象的addEventListener方法添加扩展事件监听器,当指定事件发生时,将触发对应额监听回调函数。</span></span></p>
<h2 style="margin-left:.8em;"><span style="color:#f13a0e;"><strong><span style="background-color:#f6f4f2;">参数:</span></strong></span></h2>
<ul><li>event: <em>( DOMString ) 必选 </em>要添加监听的事件类型,可取上面列出的所有事件常量 <p style="margin-left:0;"></p> </li><li>callback: <em>( <ahref="https://blog.csdn.net/qq_40575646/article/details/122686172#plus.Events.EventTrigCallback">EventTrigCallback</a> ) 必选 </em>扩展API加载完毕触发的回调函数 <p style="margin-left:0;"></p> </li><li>capture: <em>( Boolean ) 可选 </em>事件流捕获顺序,可忽略 <p style="margin-left:0;"></p> </li></ul>
<h2 style="margin-left:.8em;"><span style="color:#f13a0e;"><strong><span style="background-color:#f6f4f2;">返回值:</span></strong></span></h2>
<p>void<span style="color:#474747;"><span style="background-color:#f6f4f2;"> : 无</span></span></p>
<h1 style="margin-left:0;"><span style="color:#474747;"><span style="background-color:#f6f4f2;"><!--LINK#0_46-->EventTrigCallback</span></span></h1>
<p style="margin-left:0;"><span style="color:#474747;"><span style="background-color:#f6f4f2;">事件触发回调函数</span></span></p>
<pre class="has" style="margin-left:0;"><code class="language-prettyprint"><span style="background-color:#333333"><span style="color:#474747"><code>
<span style="color:#f0e68c"><strong>void</strong></span><span style="color:#ffffff"> onTrig</span><span style="color:#ffffff">(){</span>
<span style="color:#87ceeb">// Event trig code</span>
<span style="color:#ffffff">}</span>
</code></span></span></code></pre>
<h2 style="margin-left:.8em;"><span style="color:#f13a0e;"><strong><span style="background-color:#f6f4f2;">说明:</span></strong></span></h2>
<p style="margin-left:0;"><span style="color:#474747;"><span style="background-color:#f6f4f2;">指定事件触发时的回调函数,在指定的事件已经发生时调用。</span></span></p>
<h2 style="margin-left:.8em;"><span style="color:#f13a0e;"><strong><span style="background-color:#f6f4f2;">参数:</span></strong></span></h2>
<p style="margin-left:0;"><span style="color:#474747;"><span style="background-color:#f6f4f2;">无</span></span></p>
<h2 style="margin-left:.8em;"><span style="color:#f13a0e;"><strong><span style="background-color:#f6f4f2;">返回值:</span></strong></span></h2>
<p>void<span style="color:#474747;"><span style="background-color:#f6f4f2;"> : 无</span></span></p>
<h1 style="margin-left:0;"><span style="color:#474747;"><span style="background-color:#f6f4f2;"><!--LINK#0_47-->ErrorEventTrigCallback</span></span></h1>
<p style="margin-left:0;"><span style="color:#474747;"><span style="background-color:#f6f4f2;">页面加载错误事件回调函数</span></span></p>
<pre class="has" style="margin-left:0;"><code class="language-prettyprint"><span style="background-color:#333333"><span style="color:#474747"><code>
<span style="color:#f0e68c"><strong>void</strong></span><span style="color:#ffffff"> onErrorTrig</span><span style="color:#ffffff">(</span><span style="color:#98fb98">Event</span> <span style="color:#f0e68c"><strong>event</strong></span><span style="color:#ffffff">){</span>
<span style="color:#87ceeb">// Event trig code</span>
<span style="color:#f0e68c"><strong>var</strong></span><span style="color:#ffffff"> url </span><span style="color:#ffffff">=</span> <span style="color:#f0e68c"><strong>event</strong></span><span style="color:#ffffff">.</span><span style="color:#ffffff">url</span><span style="color:#ffffff">;</span><span style="color:#87ceeb">// 加载错误的页面路径,API中传入的url值</span>
<span style="color:#f0e68c"><strong>var</strong></span><span style="color:#ffffff"> href </span><span style="color:#ffffff">=</span> <span style="color:#f0e68c"><strong>event</strong></span><span style="color:#ffffff">.</span><span style="color:#ffffff">href</span><span style="color:#ffffff">;</span><span style="color:#87ceeb">// 加载错误的页面完整路径,通常以“file://”开头的路径</span>
<span style="color:#ffffff">}</span>
</code></span></span></code></pre>
<h2 style="margin-left:.8em;"><span style="color:#f13a0e;"><strong><span style="background-color:#f6f4f2;">说明:</span></strong></span></h2>
<p style="margin-left:0;"><span style="color:#474747;"><span style="background-color:#f6f4f2;">当Webview窗口加载页面失败后打开错误页面时触发此事件。</span></span></p>
<h2 style="margin-left:.8em;"><span style="color:#f13a0e;"><strong><span style="background-color:#f6f4f2;">参数:</span></strong></span></h2>
<ul><li>event: <em>( Event ) 可选 </em>加载页面失败信息 <p style="margin-left:0;"><span style="color:#474747;">可通过event.url(String类型)获取加载页面的url值,如“./test/html”; 可通过event.href(String类型)加载错误的页面完整路径,包括完整的协议头,如Android平台“file:///storage/sdcard0/Android/data/io.dcloud.HBuilder/.HBuilder/apps/HBuilder/www/test.html”,iOS平台“file:///var/mobile/Containers/Data/Application/757966CF-345C-4348-B07F-EEF83CF9A369/Library/Pandora/apps/HBuilder/www/test.html”。</span></p> </li></ul>
<h2 style="margin-left:.8em;"><span style="color:#f13a0e;"><strong><span style="background-color:#f6f4f2;">返回值:</span></strong></span></h2>
<p>void<span style="color:#474747;"><span style="background-color:#f6f4f2;"> : 无</span></span></p>
</div>
</div>
<div id="treeSkill"></div>
页:
[1]