(更多精彩内容请访问DCloud官网(http://www.dcloud.io/))
要虚拟键盘显示“搜索”二字,需满足以下两个条件:
(1)设置input属性 type=‘search’
(2)input需在form表单中。
html代码
<form action="">
<div class="mui-input-row mui-search">
<input id="search" type="search" class="mui-input-clear" placeholder="输入关键字搜索">
div>
form>
若是实现点击"搜索",实现搜索事件,需要对按键进行监听。注意要点:
(1)监听事件类型“keypress”
(2)event.keyCode == "13"
(3)event.preventDefault(); // 阻止默认事件---阻止页面刷新(表单提交)
js代码
document.getElementById("search").addEventListener("keypress",function(event) {
if(event.keyCode == "13") {
document.activeElement.blur();//收起虚拟键盘
toSearch();//TODO 完成搜索事件
event.preventDefault(); // 阻止默认事件---阻止页面刷新
}
});
app中有一个分享功能,将开发流程及代码做以下记录。
1.申请第三方APPKEY,具体流程参考:
新浪微博appkey申请步骤
腾讯微博appkey申请方法
微信appkey申请方法
2.介绍
这边分享类型有:微信好友、朋友圈、新浪微博、复制链接。
3.代码
第一步:获取分享服务。(涉及到plus对象的都要写在mui.plusReady方法里面)
/**
* 获取分享服务
*/
function updateSerivces() {
plus.share.getServices(function(s) {
shares = {};
for(var i in s) {
var t = s[i];
shares[t.id] = t;
}
//微信服务
weixinss = shares['weixin'];
//新浪服务
sinaweiboss = shares['sinaweibo'];
weixinShare ={
title: '微信朋友圈',
s: weixinss,
x: 'WXSceneTimeline'
}
weixinShareSession ={
title: '微信好友',
s: weixinss,
x: 'WXSceneSession'
}
sinaweibo = {
title: '新浪微博',
s: sinaweiboss
}
}, function(e) {
_.toast("获取分享服务列表失败:" + e.message);
});
}
第二步:触发分享操作的编码
比如:
//点击微信好友分享
doc.querySelector(".m-btn.btnweixin").addEventListener("tap",function(){
shareAction(weixinShareSession,false);
});
//点击朋友圈分享
doc.querySelector(".m-btn.btnpengyouquan").addEventListener("tap",function(){
shareAction(weixinShare,false);
});
//点击新浪微博分享
doc.querySelector(".m-btn.btnsina").addEventListener("tap",function(){
shareAction(sinaweibo,false);
});
/**
* 分享操作
* @param {JSON} sb 分享操作对象s.s为分享通道对象(plus.share.ShareService)
* @param {Boolean} bh 是否分享链接
*/
function shareAction(sb, bh) {
if(!sb || !sb.s) {
_.toast("无效的分享服务!");
return;
}
var msg = {
content: title_share,//分享的标题
href:href,
extra: {
scene: sb.x
}
};
// 发送分享
if(sb.s.authenticated) {
shareMessage(msg, sb.s);
} else {
sb.s.authorize(function(){
shareMessage(msg, sb.s);
}, function(e) {
console.log(e.code);
_.toast("认证授权失败");
});
}
}
第三步:发送分享消息方法的编写
/**
* 发送分享消息
* @param {JSON} msg
* @param {plus.share.ShareService} s
*/
function shareMessage(msg, s) {
s.send(msg, function() {
_.toast("分享到\"" + s.description + "\"成功! ");
}, function(e) {
_.toast("分享到\"" + s.description + "\"失败: ");
});
}
其中有一个复制链接部分,是使用native.js调用原生接口实现。
//android
function copyToClipAndroid(val) {
var Context = plus.android.importClass("android.content.Context");
var main = plus.android.runtimeMainActivity();
var clip = main.getSystemService(Context.CLIPBOARD_SERVICE);
plus.android.invoke(clip, "setText", val);
mui.toast("复制成功");
}
//ios
function copyToClipIos(val) {
var UIPasteboard = plus.ios.importClass("UIPasteboard");
var generalPasteboard = UIPasteboard.generalPasteboard();
// 设置/获取文本内容:
generalPasteboard.plusCallMethod({
setValue: val,
forPasteboardType: "public.utf8-plain-text"
});
generalPasteboard.plusCallMethod({
valueForPasteboardType: "public.utf8-plain-text"
});
mui.toast("复制成功");
}