Webview module manages the application window interface and realizes the logical control and management operation of multiple windows

A set of properties that define page or control deformations

A set of properties that define the effect of a page or control transformation

Properties:

  • Property: (String type) the property that produces the transformation effect

    The default value is "all", and other values are not supported temporarily.

    Platform support

    • Android - 2.2 + (supported)
    • iOS - 4.3 + (supported)
  • Duration: (String type) the duration of the transformation

    The default value is 0, which means there is no animation effect.

    Platform support

    • Android - 2.2 + (supported)
    • iOS - 4.3 + (supported)
  • timingfunction: (String type) window transformation effect

    Available values: "linear": uniform change, uniform animation effect; "Ease in": the animation effect of uniformly accelerating the change and gradually becoming faster; "Ease out": the animation effect of uniformly decelerating the change and gradually slowing down; "Ease in out": the animation effect of first accelerating and then decelerating, and first accelerating and then slowing down. The default value is "ease in out".

    Platform support

    • Android - 2.2 + (supported)
    • iOS - 4.3 + (supported)

Parameters for intercepting Webview window resource requests

Properties:

  • match: (String type) configure the URL address that needs to intercept the requested resource

    Regular expressions are supported. The default value is an empty string (i.e. no interception).

  • redirect: (String type) the resource address that intercepts redirection

    Only local resource addresses are supported, such as paths starting with "_www", "U doc", "U downloads", "U documents", etc.

  • mime: (String type) the data type of the redirected resource

    Data types defined in RFC2045/RFC2046/RFC2047/RFC2048/RFC2049 specifications. Such as plain text (text/plain), PNG image (image/png), GIF graphics (image/gif), JPEG graphics (image/jpeg). If the mime type is not specified, it is automatically allocated according to the redirected resource path.

  • encoding: (String type) redirected resource data code

    If not set, the default value "UTF-8" is used.

  • Data header of resource redirection: (http header)

    You can set annotation http header data (such as content type) or user-defined data. Generally, this attribute can be used to set the cache policy (such as cache control) to intercept resources.

Properties that intercept Webview window URL requests

Properties:

  • effect: (String type) the effective time of intercepting URL request

    Available values: "instant" - indicates immediate effect, that is, it takes effect immediately after calling the overrideurllloading method; "Touchstart" - means that the user operates the Webview window (triggering the touchstart event). If the user does not operate the Webview window, the URL request operation will not be intercepted. The default value is "instant".

  • Mode: (String type) interception mode

    Available values: "allow" means that the url will not be intercepted to continue loading when the conditions defined by the match attribute are met. If the conditions defined by the match attribute are not met, the url jump will be intercepted and the callback will be triggered; "Reject" means that the url jump is intercepted and the callback is triggered when the submission defined by the match attribute is met. When the conditions defined by the match attribute are not met, the url is not intercepted and continues to load. The default value is reject.

  • match: (String type) configure whether to process URL requests

    Regular expressions are supported. The default value is effective for all URL addresses (equivalent to regular expression ". *"). If the mode value is "allow", the configured URL request is allowed to jump, and if the mode value is "reject", the configured URL request is intercepted.

  • Exclude: (String type) exclude the type of intercepting processing request

    Do not intercept and process URL requests of the specified type, and directly use the system default processing logic. Available values: "None" means that no URL requests are excluded (i.e. all URL requests are intercepted and processed); "redirect" means to exclude the interception of 301 / 302 jump requests (use with caution. URL requests triggered by href other than a tag may be misjudged as 302 jump). The default value is none.

Listen for Webview window resource loading properties

Properties:

  • match: (String type) configure whether to process URL resources

    Regular expressions are supported. The default value is effective for all URL resource requests (equivalent to regular expression ". *"). If the resource configuration conditions loaded by Webview trigger a callback event.

Callback function of Webview window rebound event

<span style="color:#474747"><span style="background-color:#333333"><code>
<span style="color:#f0e68c"><strong>void</strong></span><span style="color:#ffffff"> onEvent</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 handled code.</span>
<span style="color:#ffffff">}</span>
				</code></span></span>

Parameters:

  • Event: (event) required; event data when the Webview window rebound event is triggered

    The Event object contains the following attributes: Status - indicates the springback position status, which can be taken after setting the springback changeoffset attribute of the top drop-down: "beforeChangeOffset" indicates that the dragging can continue. At this time, when the dragging window is released, it will rebound to its initial position; "afterChangeOffset" indicates that the rebound can be docked. At this time, if you release the drag window, it will rebound to the docked position; "dragEndAfterChangeOffset" indicates that the drag has been released and the window rebounds to the docking position. The value can be taken after setting the sideslip slideoffset attribute of the left and right sides: "beforeSlide" indicates the state of no sideslip; "afterSlide" indicates that it has been sideslip. offset - indicates the rebound direction, with values available: "left" indicates left sliding, "right" indicates right sliding, "top" indicates upper pull-down sliding. target - save the Webview window object that triggers this Event.

Return value:

void: None

Example:

<span style="color:#474747"><span style="background-color:#333333"><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">Webview 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:#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:#87ceeb "> / / H5 plus event handling</span>
<span style="color:#f0e68c"><strong>function</strong></span><span style="color:#ffffff"> plusReady</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">
	ws</span><span style="color:#ffffff">.</span><span style="color:#ffffff">setBounce</span><span style="color:#ffffff">({</span><span style="color:#ffffff">position</span><span style="color:#ffffff">:{</span><span style="color:#ffffff">top</span><span style="color:#ffffff">:</span><span style="color:#ffa0a0">'100px'</span><span style="color:#ffffff">},</span><span style="color:#ffffff">changeoffset</span><span style="color:#ffffff">:{</span><span style="color:#ffffff">top</span><span style="color:#ffffff">:</span><span style="color:#ffa0a0">'44px'</span><span style="color:#ffffff">}});</span><span style="color:#ffffff">
	ws</span><span style="color:#ffffff">.</span><span style="color:#ffffff">addEventListener</span><span style="color:#ffffff">(</span><span style="color:#ffa0a0">'dragBounce'</span><span style="color:#ffffff">,</span><span style="color:#ffffff"> onPullStateChange</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>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:#87ceeb "> / / drop down status changes</span>
<span style="color:#f0e68c"><strong>function</strong></span><span style="color:#ffffff"> onPullStateChange</span><span style="color:#ffffff">(</span><span style="color:#ffffff">e</span><span style="color:#ffffff">){</span>
	<span style="color:#f0e68c"><strong>switch</strong></span><span style="color:#ffffff">(</span><span style="color:#ffffff">e</span><span style="color:#ffffff">.</span><span style="color:#ffffff">status</span><span style="color:#ffffff">){</span>
		<span style="color:#f0e68c"><strong>case</strong></span> <span style="color:#ffa0a0">'beforeChangeOffset'</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">'Top rebound: you can continue to drag down'</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:#ffa0a0">'afterChangeOffset'</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">'Top rebound: release will reset the rebound position'</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:#ffa0a0">'dragEndAfterChangeOffset'</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">'Top rebound: release docking rebound'</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:#f0e68c"><strong>break</strong></span><span style="color:#ffffff">;</span>
	<span style="color:#ffffff">}</span>
<span style="color:#ffffff">}</span>
<span style="color:#87ceeb "> / / reset the rebound position of the window</span>
<span style="color:#f0e68c"><strong>function</strong></span><span style="color:#ffffff"> resetBounce</span><span style="color:#ffffff">(){</span><span style="color:#ffffff">
	ws</span><span style="color:#ffffff">.</span><span style="color:#ffffff">resetBounce</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:#bdb76b"><strong>style</strong></span><span style="color:#ffffff">=</span><span style="color:#ffa0a0">"</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:#ffa0a0">"</span><span style="color:#f0e68c"><strong>></strong></span>
		<span style="color:#f0e68c"><strong><br/><br/><br/></strong></span><span style="color:#ffffff">
		set up Webview Rebound effect of window</span><span style="color:#f0e68c"><strong><br/></strong></span><span style="color:#ffffff">
		Display docked to 44 After rebound px Location of</span><span style="color:#f0e68c"><strong><br/><br/></strong></span>
		<span style="color:#f0e68c"><strong><button</strong></span> <span style="color:#bdb76b"><strong>onclick</strong></span><span style="color:#ffffff">=</span><span style="color:#ffa0a0">"</span><span style="color:#ffffff">resetBounce</span><span style="color:#ffffff">()</span><span style="color:#ffa0a0">"</span><span style="color:#f0e68c"><strong>></strong></span><span style="color:#ffffff">Reset rebound position</span><span style="color:#f0e68c"><strong></button></strong></span>
		<span style="color:#f0e68c"><strong><br/><br/><br/></strong></span><span style="color:#ffffff">
		*Only the rebound effect of the top is supported temporarily*
	</span><span style="color:#f0e68c"><strong></body></strong></span>
<span style="color:#f0e68c"><strong></html></strong></span>
				</code></span></span>

Precautions for using plus in uni app

Callback function of Webview window event

<span style="color:#474747"><span style="background-color:#333333"><code>
<span style="color:#f0e68c"><strong>void</strong></span><span style="color:#ffffff"> onEvent</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 handled code.</span>
<span style="color:#ffffff">}</span>
				</code></span></span>

Parameters:

  • Event: (Object) optional: event data when Webview window event is triggered

    The callback parameter contains the following attributes: target: save the Webview window object that triggers this event; Progress: saves the loading progress of the window page. This attribute is only available when the "progressChanged" event occurs.

Return value:

void: None

Example:

<span style="color:#474747"><span style="background-color:#333333"><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">Webview 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:#f0e68c"><strong>var</strong></span><span style="color:#ffffff"> nw</span><span style="color:#ffffff">=</span><span style="color:#f0e68c"><strong>null</strong></span><span style="color:#ffffff">;</span>
<span style="color:#87ceeb "> / / H5 plus event handling</span>
<span style="color:#f0e68c"><strong>function</strong></span><span style="color:#ffffff"> plusReady</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:#87ceeb "> / / listen for the Webview window page loading completion event</span>
<span style="color:#f0e68c"><strong>function</strong></span><span style="color:#ffffff"> eventTest</span><span style="color:#ffffff">()</span> <span style="color:#ffffff">{</span>
	<span style="color:#87ceeb">// Open a new window < / span > < span style = "color: #ffffff" >
	nw</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">create</span><span style="color:#ffffff">(</span><span style="color:#ffa0a0">''</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">top</span><span style="color:#ffffff">:</span><span style="color:#ffa0a0">'46px'</span><span style="color:#ffffff">,</span><span style="color:#ffffff">bottom</span><span style="color:#ffffff">:</span><span style="color:#ffa0a0">'0px'</span><span style="color:#ffffff">);</span><span style="color:#ffffff">
	nw</span><span style="color:#ffffff">.</span><span style="color:#ffffff">addEventListener</span><span style="color:#ffffff">(</span><span style="color:#ffa0a0">'loaded'</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">
		console</span><span style="color:#ffffff">.</span><span style="color:#ffffff">log</span><span style="color:#ffffff">(</span><span style="color:#ffa0a0">'Loaded: '</span><span style="color:#ffffff">+</span><span style="color:#ffffff">e</span><span style="color:#ffffff">.</span><span style="color:#ffffff">target</span><span style="color:#ffffff">.</span><span style="color:#ffffff">getURL</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">
	nw</span><span style="color:#ffffff">.</span><span style="color:#ffffff">show</span><span style="color:#ffffff">();</span> <span style="color:#87ceeb "> / / display window</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:#ffffff">
		Webview Window page loading completion event
		</span><span style="color:#f0e68c"><strong><button</strong></span> <span style="color:#bdb76b"><strong>onclick</strong></span><span style="color:#ffffff">=</span><span style="color:#ffa0a0">"</span><span style="color:#ffffff">eventTest</span><span style="color:#ffffff">()</span><span style="color:#ffa0a0">"</span><span style="color:#f0e68c"><strong>></strong></span><span style="color:#ffffff">start</span><span style="color:#f0e68c"><strong></button></strong></span>
		<span style="color:#f0e68c"><strong><button</strong></span> <span style="color:#bdb76b"><strong>onclick</strong></span><span style="color:#ffffff">=</span><span style="color:#ffa0a0">"</span><span style="color:#ffffff">nw</span><span style="color:#ffffff">.</span><span style="color:#ffffff">loadURL</span><span style="color:#ffffff">(</span><span style="color:#ffa0a0">'http://m.weibo.cn/u/3196963860'</span><span style="color:#ffffff">)</span><span style="color:#ffa0a0">"</span><span style="color:#f0e68c"><strong>></strong></span><span style="color:#ffffff">loaded</span><span style="color:#f0e68c"><strong></button></strong></span>
	<span style="color:#f0e68c"><strong></body></strong></span>
<span style="color:#f0e68c"><strong></html></strong></span>
				</code></span></span>

Precautions for using plus in uni app

Callback function of Webview window sideslip event

<span style="color:#474747"><span style="background-color:#333333"><code>
<span style="color:#f0e68c"><strong>void</strong></span><span style="color:#ffffff"> onEvent</span><span style="color:#ffffff">(</span> <span style="color:#98fb98">PopGestureEvent</span> <span style="color:#f0e68c"><strong>event</strong></span> <span style="color:#ffffff">){</span>
	<span style="color:#87ceeb">// Event handled code.</span>
<span style="color:#ffffff">}</span>
				</code></span></span>

Parameters:

  • event: ( PopGestureEvent (required) event data when Webview window event is triggered

    The PopGestureEvent object contains the following attributes: target: the Webview window object that holds the sideslip operation. Type: save the sideslip event type, "start" indicates the start of sideslip return, which is triggered when the user presses sliding; "End" indicates the end of sideslip return, which is triggered when the user releases his hand; "move" indicates the end of the sideslip return action, which is triggered when the user moves the sideslip. Result: save the operation result, which is valid only when e.type is end, boolean type, true means the sideslip return is executed, false means the sideslip return is cancelled; otherwise, it is undefined. progress: save the sideslip position, Number type, with decimal point and range of 0-100.

Return value:

void: None

Example:

<span style="color:#474747"><span style="background-color:#333333"><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">Webview 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:#f0e68c"><strong>var</strong></span><span style="color:#ffffff"> nw</span><span style="color:#ffffff">=</span><span style="color:#f0e68c"><strong>null</strong></span><span style="color:#ffffff">;</span>
<span style="color:#87ceeb "> / / H5 plus event handling</span>
<span style="color:#f0e68c"><strong>function</strong></span><span style="color:#ffffff"> plusReady</span><span style="color:#ffffff">(){</span><span style="color:#ffffff">
	createWebview</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:#87ceeb "> / / create a Webview window to listen for sideslip return events</span>
<span style="color:#f0e68c"><strong>function</strong></span><span style="color:#ffffff"> createWebview</span><span style="color:#ffffff">(){</span>
	<span style="color:#87ceeb">// Open a new window < / span > < span style = "color: #ffffff" >
	nw</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">create</span><span style="color:#ffffff">(</span><span style="color:#ffa0a0">'http://m.weibo.cn/u/3196963860'</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">top</span><span style="color:#ffffff">:</span><span style="color:#ffa0a0">'100px'</span><span style="color:#ffffff">,</span><span style="color:#ffffff">bottom</span><span style="color:#ffffff">:</span><span style="color:#ffa0a0">'0px'</span><span style="color:#ffffff">,</span><span style="color:#ffffff">popGesture</span><span style="color:#ffffff">:</span><span style="color:#ffa0a0">'hide'</span><span style="color:#ffffff">});</span><span style="color:#ffffff">
	nw</span><span style="color:#ffffff">.</span><span style="color:#ffffff">addEventListener</span><span style="color:#ffffff">(</span><span style="color:#ffa0a0">'popGesture'</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">
		poplog</span><span style="color:#ffffff">.</span><span style="color:#ffffff">innerText</span><span style="color:#ffffff">=</span><span style="color:#ffa0a0">'popGesture: '</span><span style="color:#ffffff">+</span><span style="color:#ffffff">e</span><span style="color:#ffffff">.</span><span style="color:#ffffff">type</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">result</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">progress</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">}</span>
<span style="color:#87ceeb "> / / display the Webview window</span>
<span style="color:#f0e68c"><strong>function</strong></span><span style="color:#ffffff"> showWebview</span><span style="color:#ffffff">(){</span><span style="color:#ffffff">
	nw</span><span style="color:#ffffff">.</span><span style="color:#ffffff">show</span><span style="color:#ffffff">(</span><span style="color:#ffa0a0">'slide-in-right'</span><span style="color:#ffffff">);</span>
<span style="color:#ffffff">}</span>
<span style="color:#87ceeb "> / / hide Webview window</span>
<span style="color:#f0e68c"><strong>function</strong></span><span style="color:#ffffff"> hideWebview</span><span style="color:#ffffff">(){</span><span style="color:#ffffff">
	nw</span><span style="color:#ffffff">.</span><span style="color:#ffffff">hide</span><span style="color:#ffffff">();</span>
<span style="color:#ffffff">}</span>
<span style="color:#87ceeb "> / / close the window</span>
<span style="color:#f0e68c"><strong>function</strong></span><span style="color:#ffffff"> closeWebview</span><span style="color:#ffffff">(){</span><span style="color:#ffffff">
	nw</span><span style="color:#ffffff">.</span><span style="color:#ffffff">close</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">close</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:#ffffff">
		Webview Window sideslip return event
		</span><span style="color:#f0e68c"><strong><button</strong></span> <span style="color:#bdb76b"><strong>onclick</strong></span><span style="color:#ffffff">=</span><span style="color:#ffa0a0">"</span><span style="color:#ffffff">closeWebview</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></button></strong></span>
		<span style="color:#f0e68c"><strong><button</strong></span> <span style="color:#bdb76b"><strong>onclick</strong></span><span style="color:#ffffff">=</span><span style="color:#ffa0a0">"</span><span style="color:#ffffff">showWebview</span><span style="color:#ffffff">()</span><span style="color:#ffa0a0">"</span><span style="color:#f0e68c"><strong>></strong></span><span style="color:#ffffff">Show</span><span style="color:#f0e68c"><strong></button></strong></span>
		<span style="color:#f0e68c"><strong><button</strong></span> <span style="color:#bdb76b"><strong>onclick</strong></span><span style="color:#ffffff">=</span><span style="color:#ffa0a0">"</span><span style="color:#ffffff">hideWebview</span><span style="color:#ffffff">()</span><span style="color:#ffa0a0">"</span><span style="color:#f0e68c"><strong>></strong></span><span style="color:#ffffff">Hide</span><span style="color:#f0e68c"><strong></button></strong></span>
		<span style="color:#f0e68c"><strong><div</strong></span> <span style="color:#bdb76b"><strong>id</strong></span><span style="color:#ffffff">=</span><span style="color:#ffa0a0">"poplog"</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>

Precautions for using plus in uni app

Callback function of history query

<span style="color:#474747"><span style="background-color:#333333"><code>
<span style="color:#f0e68c"><strong>void</strong></span><span style="color:#ffffff"> onHistoryQuery</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:#ffffff">{</span>
	<span style="color:#87ceeb">// Event handled code.</span>
	<span style="color:#f0e68c"><strong>var</strong></span><span style="color:#ffffff"> canBack </span><span style="color:#ffffff">=</span> <span style="color:#f0e68c"><strong>event</strong></span><span style="color:#ffffff">.</span><span style="color:#ffffff">canBack</span><span style="color:#ffffff">;</span>
	<span style="color:#f0e68c"><strong>var</strong></span><span style="color:#ffffff"> canForward </span><span style="color:#ffffff">=</span> <span style="color:#f0e68c"><strong>event</strong></span><span style="color:#ffffff">.</span><span style="color:#ffffff">canForward</span><span style="color:#ffffff">;</span>
<span style="color:#ffffff">}</span>
				</code></span></span>

Parameters:

  • Event: (event) required to query Webview window history operation event data

    The canBack property of event can be used to obtain whether the Webview window can go back, and the canForward property of event can be used to obtain whether the Webview window can go forward.

Return value:

void: None

Callback function for loading resource events in Webview window

<span style="color:#474747"><span style="background-color:#333333"><code>
<span style="color:#f0e68c"><strong>void</strong></span><span style="color:#ffffff"> onLoadingResource</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:#ffffff">{</span>
	<span style="color:#87ceeb">// Event handled 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:#ffffff">}</span>
				</code></span></span>

Parameters:

  • Event: (event) required. The Webview window loads resource event data

    The URL address of the resource to be loaded can be obtained through the URL attribute of event.

Return value:

void: None

Callback function of Webview window to intercept URL link jump

<span style="color:#474747"><span style="background-color:#333333"><code>
<span style="color:#f0e68c"><strong>void</strong></span><span style="color:#ffffff"> onOverride</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:#ffffff">{</span>
	<span style="color:#87ceeb">// Event handled 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:#ffffff">}</span>
				</code></span></span>

Parameters:

  • Event: (event) required. Webview window intercepts URL jump event data

    The intercepted URL address can be obtained through the URL attribute of event.

Return value:

void: None

Callback function for loading page title update in Webview window

<span style="color:#474747"><span style="background-color:#333333"><code>
<span style="color:#f0e68c"><strong>void</strong></span><span style="color:#ffffff"> onQuery</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:#ffffff">{</span>
	<span style="color:#87ceeb">// Event handled code.</span>
<span style="color:#ffffff">}</span>
				</code></span></span>

Parameters:

  • Event: (event) required. The Webview window loads the page title and updates the event data

    The title of the Webview window can be obtained through the title attribute of event.

Return value:

void: None

Webview window combination animation callback function

<span style="color:#474747"><span style="background-color:#333333"><code>
<span style="color:#f0e68c"><strong>void</strong></span><span style="color:#ffffff"> onAnimationFinished</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:#ffffff">{</span>
	<span style="color:#87ceeb">// Event handled code.</span>
<span style="color:#ffffff">}</span>
				</code></span></span>

Parameters:

  • Event: (event) required; Webview window animation completes the event data

    The id of the corresponding Webview window can be obtained through the id attribute of event. If the id of the operated window is not set, an empty string will be returned; The corresponding Webview window object can be obtained through the target attribute of event.

Return value:

void: None

Example:

<span style="color:#474747"><span style="background-color:#333333"><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">Webview 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:#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:#ffffff">wn</span><span style="color:#ffffff">=</span><span style="color:#f0e68c"><strong>null</strong></span><span style="color:#ffffff">;</span>
<span style="color:#87ceeb "> / / H5 plus event handling</span>
<span style="color:#f0e68c"><strong>function</strong></span><span style="color:#ffffff"> plusReady</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:#87ceeb">// Pre create new window (displayed outside the visual area) < / span > < span style = "color: #ffffff" >
	wn</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">create</span><span style="color:#ffffff">(</span><span style="color:#ffa0a0">'http://m.weibo.cn/u/3196963860'</span><span style="color:#ffffff">,</span> <span style="color:#ffa0a0">'newdrag'</span><span style="color:#ffffff">,</span> <span style="color:#ffffff">{</span><span style="color:#ffffff">left</span><span style="color:#ffffff">:</span><span style="color:#ffa0a0">'100%'</span><span style="color:#ffffff">,</span><span style="color:#ffffff">render</span><span style="color:#ffffff">:</span><span style="color:#ffa0a0">'always'</span><span style="color:#ffffff">});</span><span style="color:#ffffff">
	wn</span><span style="color:#ffffff">.</span><span style="color:#ffffff">show</span><span style="color:#ffffff">(</span><span style="color:#ffa0a0">'none'</span><span style="color:#ffffff">);</span>
	<span style="color:#87ceeb">// Slide right to hide new window < / span > < span style = "color: #ffffff" >
	wn</span><span style="color:#ffffff">.</span><span style="color:#ffffff">drag</span><span style="color:#ffffff">({</span><span style="color:#ffffff">direction</span><span style="color:#ffffff">:</span><span style="color:#ffa0a0">'right'</span><span style="color:#ffffff">,</span><span style="color:#ffffff">moveMode</span><span style="color:#ffffff">:</span><span style="color:#ffa0a0">'followFinger'</span><span style="color:#ffffff">},</span> <span style="color:#ffffff">{</span><span style="color:#ffffff">view</span><span style="color:#ffffff">:</span><span style="color:#ffffff">ws</span><span style="color:#ffffff">,</span><span style="color:#ffffff">moveMode</span><span style="color:#ffffff">:</span><span style="color:#ffa0a0">'follow'</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">
		console</span><span style="color:#ffffff">.</span><span style="color:#ffffff">log</span><span style="color:#ffffff">(</span><span style="color:#ffa0a0">'Right drag event: '</span><span style="color:#ffffff">+</span><span style="color:#ffffff">JSON</span><span style="color:#ffffff">.</span><span style="color:#ffffff">stringify</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:#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:#87ceeb "> / / window combination animation</span>
<span style="color:#f0e68c"><strong>function</strong></span><span style="color:#ffffff"> webviewAnimation</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">startAnimation</span><span style="color:#ffffff">({</span><span style="color:#ffffff">view</span><span style="color:#ffffff">:</span><span style="color:#ffffff">ws</span><span style="color:#ffffff">,</span><span style="color:#ffffff">styles</span><span style="color:#ffffff">:{</span><span style="color:#ffffff">fromLeft</span><span style="color:#ffffff">:</span><span style="color:#ffa0a0">'0%'</span><span style="color:#ffffff">,</span><span style="color:#ffffff">toLeft</span><span style="color:#ffffff">:</span><span style="color:#ffa0a0">'-100%'</span><span style="color:#ffffff">},</span><span style="color:#ffffff">action</span><span style="color:#ffffff">:</span><span style="color:#ffa0a0">'none'</span><span style="color:#ffffff">},</span>
	<span style="color:#ffffff">{</span><span style="color:#ffffff">view</span><span style="color:#ffffff">:</span><span style="color:#ffffff">wn</span><span style="color:#ffffff">,</span><span style="color:#ffffff">styles</span><span style="color:#ffffff">:{</span><span style="color:#ffffff">fromLeft</span><span style="color:#ffffff">:</span><span style="color:#ffa0a0">'100%'</span><span style="color:#ffffff">,</span><span style="color:#ffffff">toLeft</span><span style="color:#ffffff">:</span><span style="color:#ffa0a0">'0%'</span><span style="color:#ffffff">},</span><span style="color:#ffffff">action</span><span style="color:#ffffff">:</span><span style="color:#ffa0a0">'none'</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">
		console</span><span style="color:#ffffff">.</span><span style="color:#ffffff">log</span><span style="color:#ffffff">(</span><span style="color:#ffa0a0">'Animation finished: '</span><span style="color:#ffffff">+</span><span style="color:#ffffff">JSON</span><span style="color:#ffffff">.</span><span style="color:#ffffff">stringify</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:#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><br/><br/></strong></span>
		<span style="color:#f0e68c"><strong><button</strong></span> <span style="color:#bdb76b"><strong>onclick</strong></span><span style="color:#ffffff">=</span><span style="color:#ffa0a0">"</span><span style="color:#ffffff">webviewAnimation</span><span style="color:#ffffff">()</span><span style="color:#ffa0a0">"</span><span style="color:#f0e68c"><strong>></strong></span><span style="color:#ffffff">Window combination animation displays a new window</span><span style="color:#f0e68c"><strong></button></strong></span>
		<span style="color:#f0e68c"><strong><br/><br/></strong></span><span style="color:#ffffff">
		You can slide right back in a new window (the new window moves out of the screen)
	</span><span style="color:#f0e68c"><strong></body></strong></span>
<span style="color:#f0e68c"><strong></html></strong></span>
				</code></span></span>

Precautions for using plus in uni app

Webview window sliding operation event callback function

<span style="color:#474747"><span style="background-color:#333333"><code>
<span style="color:#f0e68c"><strong>void</strong></span><span style="color:#ffffff"> onDrag</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:#ffffff">{</span>
	<span style="color:#87ceeb">// Event handled code.</span>
<span style="color:#ffffff">}</span>
				</code></span></span>

explain:

Triggered when the window starts sliding, during sliding and at the end of sliding. It will be triggered multiple times during sliding. The number of triggers during sliding is determined by the callback step of WebviewDragOptions object.

Parameters:

  • event: ( WebviewDragEvent ) required # Webview window sliding operation event data

Return value:

void: None

Example:

<span style="color:#474747"><span style="background-color:#333333"><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">Webview 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:#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:#ffffff">wn</span><span style="color:#ffffff">=</span><span style="color:#f0e68c"><strong>null</strong></span><span style="color:#ffffff">;</span>
<span style="color:#87ceeb "> / / H5 plus event handling</span>
<span style="color:#f0e68c"><strong>function</strong></span><span style="color:#ffffff"> plusReady</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:#87ceeb">// Pre create new window (displayed outside the visual area) < / span > < span style = "color: #ffffff" >
	wn</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">create</span><span style="color:#ffffff">(</span><span style="color:#ffa0a0">'http://m.weibo.cn/u/3196963860'</span><span style="color:#ffffff">,</span> <span style="color:#ffa0a0">'newdrag'</span><span style="color:#ffffff">,{</span><span style="color:#ffffff">left</span><span style="color:#ffffff">:</span><span style="color:#ffa0a0">'100%'</span><span style="color:#ffffff">});</span><span style="color:#ffffff">
	wn</span><span style="color:#ffffff">.</span><span style="color:#ffffff">show</span><span style="color:#ffffff">(</span><span style="color:#ffa0a0">'none'</span><span style="color:#ffffff">);</span>
	<span style="color:#87ceeb">// Slide left to display a new window < / span > < span style = "color: #ffffff" >
	ws</span><span style="color:#ffffff">.</span><span style="color:#ffffff">drag</span><span style="color:#ffffff">({</span><span style="color:#ffffff">direction</span><span style="color:#ffffff">:</span><span style="color:#ffa0a0">'left'</span><span style="color:#ffffff">,</span><span style="color:#ffffff">moveMode</span><span style="color:#ffffff">:</span><span style="color:#ffa0a0">'followFinger'</span><span style="color:#ffffff">},</span> <span style="color:#ffffff">{</span><span style="color:#ffffff">view</span><span style="color:#ffffff">:</span><span style="color:#ffa0a0">'newdrag'</span><span style="color:#ffffff">,</span><span style="color:#ffffff">moveMode</span><span style="color:#ffffff">:</span><span style="color:#ffa0a0">'follow'</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">
		console</span><span style="color:#ffffff">.</span><span style="color:#ffffff">log</span><span style="color:#ffffff">(</span><span style="color:#ffa0a0">'Left drag event: '</span><span style="color:#ffffff">+</span><span style="color:#ffffff">JSON</span><span style="color:#ffffff">.</span><span style="color:#ffffff">stringify</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:#87ceeb">// Slide right to hide new window < / span > < span style = "color: #ffffff" >
	wn</span><span style="color:#ffffff">.</span><span style="color:#ffffff">drag</span><span style="color:#ffffff">({</span><span style="color:#ffffff">direction</span><span style="color:#ffffff">:</span><span style="color:#ffa0a0">'right'</span><span style="color:#ffffff">,</span><span style="color:#ffffff">moveMode</span><span style="color:#ffffff">:</span><span style="color:#ffa0a0">'followFinger'</span><span style="color:#ffffff">},</span> <span style="color:#ffffff">{</span><span style="color:#ffffff">view</span><span style="color:#ffffff">:</span><span style="color:#ffffff">ws</span><span style="color:#ffffff">,</span><span style="color:#ffffff">moveMode</span><span style="color:#ffffff">:</span><span style="color:#ffa0a0">'follow'</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">
		console</span><span style="color:#ffffff">.</span><span style="color:#ffffff">log</span><span style="color:#ffffff">(</span><span style="color:#ffa0a0">'Right drag event: '</span><span style="color:#ffffff">+</span><span style="color:#ffffff">JSON</span><span style="color:#ffffff">.</span><span style="color:#ffffff">stringify</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:#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:#f0e68c"><strong></script></strong></span>
	<span style="color:#f0e68c"><strong></head></strong></span>
	<span style="color:#f0e68c"><strong><body></strong></span><span style="color:#ffffff">
		Slide left to open a new page
	</span><span style="color:#f0e68c"><strong></body></strong></span>
<span style="color:#f0e68c"><strong></html></strong></span>
				</code></span></span>

Precautions for using plus in uni app

Custom button click event callback function on the title bar of Webview window

<span style="color:#474747"><span style="background-color:#333333"><code>
<span style="color:#f0e68c"><strong>void</strong></span><span style="color:#ffffff"> onClicked</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 handled code.</span>
<span style="color:#ffffff">}</span>
				</code></span></span>

explain:

Triggered when the user clicks the Customize button.

Parameters:

  • Event: (event) required. Click the data when the event is triggered

    The Event object contains the following attributes: target: the WebviewBackButtonStyles object that triggered this Event.

Return value:

void: None

Webview window operation succeeded callback function

<span style="color:#474747"><span style="background-color:#333333"><code>
<span style="color:#f0e68c"><strong>void</strong></span><span style="color:#ffffff"> onSuccess</span><span style="color:#ffffff">(){</span>
	<span style="color:#87ceeb">// Success code.</span>
<span style="color:#ffffff">}</span>
				</code></span></span>

explain:

The callback function is triggered after the business operation of Webview window is successful.

Parameters:

nothing

Return value:

void: None

Webview window operation failed callback function

<span style="color:#474747"><span style="background-color:#333333"><code>
<span style="color:#f0e68c"><strong>void</strong></span><span style="color:#ffffff"> onError</span><span style="color:#ffffff">(</span><span style="color:#ffffff">error</span><span style="color:#ffffff">){</span>
	<span style="color:#87ceeb">// Handle the error</span>
	<span style="color:#f0e68c"><strong>var</strong></span><span style="color:#ffffff"> code </span><span style="color:#ffffff">=</span><span style="color:#ffffff"> error</span><span style="color:#ffffff">.</span><span style="color:#ffffff">code</span><span style="color:#ffffff">;</span> <span style="color:#87ceeb "> / / error code</span>
	<span style="color:#f0e68c"><strong>var</strong></span><span style="color:#ffffff"> message </span><span style="color:#ffffff">=</span><span style="color:#ffffff"> error</span><span style="color:#ffffff">.</span><span style="color:#ffffff">message</span><span style="color:#ffffff">;</span> <span style="color:#87ceeb "> / / error description</span>
<span style="color:#ffffff">}</span>
				</code></span></span>

Parameters:

  • Error: (Exception) optional: Webview window operation error message

    Via error Code (type Number) to obtain the error code; Via error Message (String type) gets the error description information.

Return value:

void: None

Keywords: Javascript webview

Added by thinkmarsh on Wed, 23 Feb 2022 09:37:27 +0200

Popular Keywords

©2024 Programming VIP