微信小程序自定义弹窗 点击弹窗外部 弹窗就消失了

图片说明
以上是代码,怎么设置让弹窗点击外部无反应,只能点击确定,谢谢了

5个回答

微信API有弹窗提示 或者把点击事件放入确定按钮 不要放在外层

添加 catchtouchmove 事件来阻止

<view wx:if="{{alert}}" catchtouchmove="myCatchTouch">
    <template is="alert" data="{{alertData}}" />
</view>

myCatchTouch: function () {
console.log('stop user scroll it!');
return;
},

添加 catchtouchmove 事件来阻止

myCatchTouch: function () {
console.log('stop user scroll it!');
return;
},

system("pause")

加上 catchtouchmove 事件来阻止

myCatchTouch: function () {
console.log('stop user scroll it!');
return;
},
试试吧

Csdn user default icon
上传中...
上传图片
插入图片
抄袭、复制答案,以达到刷声望分或其他目的的行为,在CSDN问答是严格禁止的,一经发现立刻封号。是时候展现真正的技术了!
其他相关推荐
微信小程序自定义弹窗 点击弹窗外部 弹窗就消失了
![图片说明](https://img-ask.csdn.net/upload/201804/20/1524229197_645775.png)rn 以上是代码,怎么设置让弹窗点击外部无反应,只能点击确定,谢谢了
点击弹窗点击弹窗点击弹窗点击弹窗点击弹窗
点击弹窗点击弹窗点击弹窗点击弹窗点击弹窗点击弹窗点击弹窗点击弹窗
微信小程序-----简单小弹窗弹窗
wx.showModal({ title: '删除提示', content: '是否删除此条数据', confirmText:&quot;确定删除&quot;, cancelText:&quot;再想想&quot;, success:function(res){ if(res.confirm){ console.log(&quot;删除&quot;) }if(res.cancel){ console.log(&quot;取消删除&quot;) }   ...
微信小程序自定义弹窗
&amp;lt;modal title='提示' wx:if=&quot;{{isShowModal}}&quot; bindcancel='cancel' bindconfirm='sure' confirm-text=&quot;去查看&quot; cancel-text=&quot;知道了&quot; &amp;gt; &amp;lt;view style='text-align: center;'&amp;gt; 您有&amp;lt;text style='...
微信小程序:弹窗
微信小程序在和用户交互时候需要给用户一些提示,例如是否请求到数据等,这时候使用弹窗是一个比较好的方法 好在微信小程序给我们提供了一个 API wx.showToast success: function (res) { app.globalData.allData = res.data.datas; if (res.data.status == 200) { ...
微信小程序自定义弹窗,Loading
var app = getApp(); var baseUrl = getApp().baseUrl; //开启toast // flag(1表示成功,2表示失败,msg表示自定义提示信息,time提示显示时长); var Toast = (flag, msg, that, time) =&gt; { that.data.toast.flag = flag; that.data.toast.msg = msg; that.data.toast.show = false; th
微信小程序自定义分享弹窗
效果图: 多种触发条件使用同一个弹窗: *.js触发处: this.setData({ isWrong:true, wrongtap:1, dialogWord:&quot;wrong&quot;, wrongDec:&quot;答案错误,是否向好友求助?&quot; })   *.wxml布局: &amp;lt;view class=&quot;wrongDialog&quot; wx:if=&quot;{{isWrong}}&quot;&amp;gt; &amp;lt...
微信小程序之自定义toast弹窗
微信小程序里面的自带弹窗icon只有两种,success和loading。有时候用户输入错误的时候想加入一个提醒图标,也可以使用wx.showToast中的image来添加图片达到使用自定义图标的目的;但是如果图标是字体,或者提醒的内容有很长捏(小程序中提醒的内容最多只能设置7个字,多了会被隐藏),那就只有自定义toast弹窗了; 第一步:新建一个wxml文件用来装模板,方便以后使用,比如
微信小程序自定义精美弹窗
微信小程序自定义弹窗微信小程序自定义弹窗微信小程序自定义弹窗微信小程序自定义弹窗
微信小程序自定义弹窗组件
看微信小程序的文档觉得说的不是很清楚。于是,找到这篇文章,觉得挺好看。大家可以看看:https://www.cnblogs.com/demod... 补充: 还需要在popup.json文件添加一句: { "component": true } ...
微信小程序自动授权弹窗(自定义)
用户进到小程序的第一个页面不是tab主页面,而是授权页面。 &amp;amp;lt;button open-type='getUserInfo' bindgetuserinfo='getuserinfo' class='sz_btn' type='primary' /&amp;amp;gt; /*微信授权登陆 */ getuserinfo:function(e){ if(e.detail.userInfo){ ...
微信小程序弹窗封装
初识小程序,好多功能都感觉新鲜。由于多个页面都需要弹窗,想着能不能跟安卓一样封装一个方法,所有都页面都能调用。记录如下: 封装模块dialog.js // component/dialog/dialog.js Component({ /** * 组件的属性列表 */ properties: { content: { type: String, ...
微信小程序之--弹窗跳转
有的时候可能需要微信弹窗的两个按钮分别跳转到不同的地方,这里在微信文档里面没有找到,但是认识的一位大神有教,在这里分享 wx.showModal({ title: '提示', content: '您还未有新八大测评或48项测评的测评结果,若并未购买请前往购买,若已购买请前往个人中心制作测评', cancelText: '去48项', ...
小程序点击弹窗事件
&amp;lt;!-- 触发弹出层:bindtap=&quot;show&quot; --&amp;gt; &amp;lt;view class=&quot;fenxiang-box&quot;&amp;gt; &amp;lt;view bindtap=&quot;show&quot; style='text-align:center' style='margin:500rpx 170rpx;text-align:center;'&amp;gt;点击&amp;lt;/view&amp;gt;
自定义小程序弹窗组件
自己写的不限制字数的弹窗,因为原生的弹窗限制字数,就无聊写了一个,不是很好,可自行优化。 描述   小程序弹窗使用方法   引入组件相关文件      在使用弹窗的页面引入组件     &amp;lt;toast id=&quot;toast&quot; params=&quot;{{params}}&quot;&amp;gt;&amp;lt;/toast&amp;gt;   在app.wxss中全局引入组件样式     @import '/components/...
弹窗点击空白部分消失
最初data里面的isShowList 值设置为为false,默认隐藏状态。&amp;lt;div @click=&quot;showList&quot;&amp;gt;点击切换出现或者消失&amp;lt;/div&amp;gt;&amp;lt;ul v-if=&quot;isShowList&quot;&amp;gt;    &amp;lt;li&amp;gt;aaa&amp;lt;/li&amp;gt;    &amp;lt;li&amp;gt;bbb&amp;lt;/li&amp;gt;&amp;lt
点击空白弹窗消失效果
html  &amp;lt;div id=&quot;user_login&quot;&amp;gt; &amp;lt;div class=&quot;login_content&quot;&amp;gt;&amp;lt;/div&amp;gt; &amp;lt;/div&amp;gt;   $(&quot;#user_login&quot;).click(function(event){           var _con = $('.login_content');   // 设置目标区域
js 点击弹窗慢慢消失
Document .btn{ width: 200px; height: 50px; margin: 100px; background: #00a; color: #fff; border: 0; font-family: "微软雅黑"; cursor: pointer;} .layer-pop-content{ position: fixed; padding: 10px 20px
显示1秒就消失的弹窗
需引入 jQuery, 下载 jquery-1.11.3.min.js   图标需要可下载       &amp;lt;!DOCTYPE html&amp;gt; &amp;lt;html&amp;gt; &amp;lt;head&amp;gt; &amp;lt;meta charset=&quot;UTF-8&quot;&amp;gt; &amp;lt;title&amp;gt;&amp;lt;/title&amp;gt; &amp;lt;script src='jquery
HTML 自定义弹窗自动消失
html中有一些弹出窗,如alert,confirm等。但是有些我们特定的需求不好实现,比如弹出窗弹出后3s后消失,所以要用到自己定义的弹出窗。如下:参考借鉴:https://zhidao.baidu.com/question/589365277.html &amp;lt;!DOCTYPE html&amp;gt; &amp;lt;html lang=&quot;en&quot;&amp;gt; &amp;lt;head&amp;gt; &amp;lt;meta c...
微信弹窗
wx.showModal({ title: '提示', content: '页面跳转至', cancelText:'地图', cancelColor:'#000', confirmColor:'#000', confirmText:'相机', success: (res) =&amp;gt; { if (res...
点击弹窗
一个点击弹出窗的小例子 html: 点击这里查看效果 关闭 正在加载,请稍后.... css: body { font-family:Arial, Helvetica, sans-serif; font-size:12px; margin:0;
自定义弹窗
本文自定义弹窗为KendamiView,基于UIViewController类 @interface KendamiView : UIViewController 类中需添加UIWindow属性 @property (nonatomic, strong) UIWindow *showWindow; KendamiView初始化 - (instancetype)init {
小程序弹窗
test.js data: { modalHidden: true, }, /** * 显示弹窗 */ buttonTap: function () { this.setData({ modalHidden: false }) }, /** * 点击取消 */ modalCandel: function...
小程序弹窗时间选择器
项目连接:https://github.com/18379259382/WXprocedure-
小程序 - 弹窗
页面设计弹窗设计, 建议采用模式 1. 引入(js) showPopup: function (e) { qp.showPopup(this, e); }, 2. 模块(wxml) &amp;lt;view wx:if=&quot;{{showXxx}}&quot; class=&quot;popup flex jc ac&quot; bindtap=&quot;hidePopup&quot; catchtouchmove=&quot;onNot&quot;&amp;gt; // jc...
小程序自定弹窗
wxml &lt;view bindtap="showRule"&gt;点击出现弹窗&lt;/view&gt; &lt;!-- 弹窗 --&gt; &lt;view class="cover {{isRuleTrue?'isRuleShow':'isRuleHide'}}"&gt; &lt;view class="window"&gt; &lt;image class="PopupWi...
小程序之页面弹窗
module页面传取,底部弹出视图,顶部提示,角标,商品数量加减
小程序的弹窗效果
小程序弹出方法效果
小程序弹窗动画
wxml代码如下 &lt;view wx:if="{{markStatus}}" class='mark'&gt; &lt;view class='approval-box bottom-pos' animation="{{animationData}}"&gt; &lt;view class='mark-title flex-sb plr30'&gt; &lt;view ...
微信小程序内嵌radio的小弹窗
在开发微信小程序中,弹窗虽然可以使用wx.showModel的API,但是这个API不够强大,content中的内容只能是String类型,如果我们想在content中加入一些单选框或者复选框来做一些数据统计时,该如何办呢?这里我写了一个可以内嵌组件的弹窗,可以查看我的博客看效果
关于Android popupwindow弹窗 要求点击弹窗以外的地方时弹窗不关闭,点击back键时弹窗关闭
[color=#FF0000][size=24px]先上一个效果图[/size][/color] [img=https://img-bbs.csdn.net/upload/201609/02/1472805199_815219.png][/img]rnrn由于这个工程,几乎都是在同一个主界面操作,只是在不同的弹窗上操作数据,所以写了很多自定义PopupWindowrn下面上一些主Activity的代码以及自定义弹窗的代码rn[color=#FF0000][size=24px]自定义弹窗:[/size][/color]rn[code=java]rnpublic class StartPopWindow extends PopupWindow rn Button btn_start = null;rn private View conentView;rn Context context;rnrn public StartPopWindow(final Activity context) rn this.context = context;rn LayoutInflater inflater = (LayoutInflater) contextrn .getSystemService(Context.LAYOUT_INFLATER_SERVICE);rn conentView = inflater.inflate(R.layout.activity_popupwindow_start, null);rn int h = context.getWindowManager().getDefaultDisplay().getHeight();rn int w = context.getWindowManager().getDefaultDisplay().getWidth();rn btn_start = (Button) conentView.findViewById(R.id.btn_start);rn // 设置SelectPicPopupWindow的Viewrn this.setContentView(conentView);rn // 设置SelectPicPopupWindow弹出窗体的宽rn this.setWidth(ViewGroup.LayoutParams.WRAP_CONTENT);rn // 设置SelectPicPopupWindow弹出窗体的高rn this.setHeight(ViewGroup.LayoutParams.WRAP_CONTENT);rn // 设置SelectPicPopupWindow弹出窗体可点击rn this.setFocusable(false);rn this.setOutsideTouchable(false);rn // 刷新状态rn // this.update();rn // 实例化一个ColorDrawable颜色为半透明rn //ColorDrawable dw = new ColorDrawable(0000000000);rn // 点back键和其他地方使其消失,设置了这个才能触发OnDismisslistener ,设置其他控件变化等操作rn this.setBackgroundDrawable(new BitmapDrawable());rn // mPopupWindow.setAnimationStyle(android.R.style.Animation_Dialog);rn // 设置SelectPicPopupWindow弹出窗体动画效果rn this.setAnimationStyle(R.style.AnimationPreview);rn rnrn public void showPopupWindow(final View parent) rn if (!this.isShowing()) rn int[] location = new int[2];rn parent.getLocationOnScreen(location);rn this.showAtLocation(parent, Gravity.NO_GRAVITY, location[0] + parent.getWidth(), location[1]);rnrn btn_start.setOnClickListener(new View.OnClickListener() rn @Overridern public void onClick(final View v) rn HouseNumberPopWindow houseNumberPopWindow = new HouseNumberPopWindow((Activity) context);rn houseNumberPopWindow.showPopupWindow(parent);rn Toast.makeText(conentView.getContext(), "1111", Toast.LENGTH_SHORT).show();rn rn );rn else rn this.dismiss();rn rn rnrn[/code]rnrn[color=#FF0000][size=24px]主Activity调用:[/size][/color]rn[code=java]rn StartPopWindow startPopWindow = new StartPopWindow(UserLoginActivity.this);rn startPopWindow.showPopupWindow(btn_regist);rn[/code]rn就是传了个Activity和一个按钮控件, 按钮控件是来设置弹窗位置的rnrn当弹窗不设置背景 这句代码时 this.setBackgroundDrawable(new BitmapDrawable());rn不管是点击弹窗外面 还是 点击back按键 都不会关闭这个弹窗,rn但是 当设置了这代码后,不管是点击弹窗外还是点击back键 都会关闭这个弹窗rn[color=#FF0000]我想点击弹窗外时 弹窗不消失,只有点击back时才关闭弹窗,而且不要影响弹窗内的一些操作事件。[/color]rnrn求大神们来看看, 我对弹窗这方面不是很理解,求指点。。。。
点击弹窗按钮后如何关闭弹窗?
来源:http://www.datouwang.com/jiaoben/109.htmlrnrn/* rn* ClassMrn* Copyright (c) 2013 Class http://gaoge.namern* E-Mail:g@gaoge.namern* Date: 2013-08 rn*/ rnvar fid = parseInt('$_G[fid]');rnvar tid = parseInt('$_G[tid]');rn//alert("jquery.classm.js");rn(function(jq) rn jq.classM = function(options)rn //alert("ClassM");rn var defaults = rn rn var options = jq.extend(defaults, options);//rn jq(document).each(function()//jq()rn jq("body").bind('contextmenu',function(e) //1.屏蔽右键rn //alert("contextmenu");rn return false; rn ); rn rn jq("[id*='-d']").mousedown(function(e) //mousedown/oncontextmenu //按下rn //clearInterval(TimerID); rn //alert("mousedown");rn show(e);//显示菜单rn ) rn rn jq("body").mouseup(function()//弹起rn clearTimeout(setM)rn )rn rn jq(document).scroll(function()//滚动rn removeClassM()rn )rn rn )rn rn //菜单显示内容rn function show(e)rn var e = e || window.event;//兼容火狐和IE rn if(e.button == "2") // rn //alert("e.button:"+e.button);rn var DJID = e.target.id || e.srcElement.id //id要小写rn if( DJID=="" ) return false; rn //alert("DJID:"+DJID);rn var aa = "forum.php?mod=post&action=reply&fid="+fid+"&tid="+tid;//+"&reppost="+pid+"&extra="+extra+"&page="+page; rn //var aa = "123";rn //alert("aa"+aa);rn options = //"="rn content:" " + rn "赞同" + rn "反对" + rn "翻译" + rn "感想", rn width:388,//this Tip Widthrn height:93,//this Tip Heightrn background:"images/bg.png",//this Tip Backgroundrn time:1,//show Timern animateTime:1//animatern rn setM = setTimeout(mouseD,options.time);rn winW = jq(window).width();rn winH = jq(document).height(); rn rn var positionX = e.originalEvent.x || e.originalEvent.layerX || 0; //兼容火狐和IE rn winX = ((positionX+options.width/2+20)>winW)?winW-20:positionX-options.width/2;//向右对齐 rn winX = (winX+20>0)?winX:20;//向左对齐 rn if ( winW-winX < options.width ) winX = winX-options.width rn rn winY = e.originalEvent.y || e.originalEvent.layerY || 0; //兼容火狐和IE rn winScroll = jq(document).scrollTop()rn winY = (window.event)?winY+winScroll-10:WinY-10;//兼容火狐和IE rn rn event.returnValue = false;rn rn rn rn mouseD = function mouseD()rn jq("body").append(" ");rn jq(".classMBg").css("opacity","0").click(function()removeClassM(););rn jq(".classMBox").remove();rn jq("body").append(rn " "rn + " "rn + options.contentrn + "");rn jq(".classMBox a").focus(function() jq(this).blur() )rn jq(".classMBox a").hover(function() jq(this).fadeTo("slow",0.5) ,function() jq(this).fadeTo("slow",1) )rn jq(".classMBox").show().animate(width:options.width+"px",options.animateTime)rn jq(document).keydown(function(event)rn if ( event.keyCode == 27 ) removeClassM() //27:escrn ) rn //alert("mD");rn rn rn function removeClassM() rn jq(".classMBox").animate(width:"0",options.animateTime,function() jq(".classMBg,.classMBox").remove() ) rn rn rn rn // rn)(jQuery);rnrn这是个右键弹窗菜单,源码修改自网络。rnrn其中:rn"感想", rn想在onclick()中调用removeClassM()来关闭右键弹窗,如何写?rnrn目的就是点击弹窗上按钮后关闭弹窗
弹窗
&lt;%@ Page Title=“设备类别管理” Language=“C#” MasterPageFile="~/BackManagement/Master_mask.Master" AutoEventWireup=“true” CodeBehind=“Equipmentcategory.aspx.cs” Inherits=“EqptRepair.BackManagement.WebForm7...
JS弹窗操作,点击遮罩层关闭弹窗
&amp;lt;!-- 打开弹窗按钮 --&amp;gt; &amp;lt;button id=&quot;myBtn&quot;&amp;gt;打开弹窗&amp;lt;/button&amp;gt; &amp;lt;!-- 弹窗 --&amp;gt; &amp;lt;div id=&quot;myModal&quot; class=&quot;modal&quot;&amp;gt; &amp;lt;!-- 弹窗内容 --&amp;gt; &amp;lt;div class=&quot;moda
WPF 自定义MessageBox 弹窗提示 弹窗加载
1. 下载Dll https://pan.baidu.com/s/1sKGQ0uHXHkkhXtMvUYPQHA 2.在项目中添加引用 略 3.在Xaml中引入名称空间 xmlns:myControl ="clr-namespace:MyCustomControlLibrary;assembly=MyCustomControlLibrary" ...
web弹窗layer之自定义弹窗位置(二)
一、需求描述如下图,要求在移动端页面的弹窗位置在上方显示。二、需求实现打开移动端layer的文档页面 http://layer.layui.com/mobile/api.html搜索位置,得到控制移动端layer的两个参数fixed和top,在layer.open中fiexed设置为false,top设置数值即可。三、代码实现:  layer.open({        type:1,      ...
自定义弹窗(三) 弹窗选择三级联动城市
Android 自定义弹窗 城市三级联动 详情请关注 http://blog.csdn.net/gdecking/article/details/22654985
相关热词 c# 标准差 计算 c#siki第五季 c#入门推荐书 c# 解码海康数据流 c# xml的遍历循环 c# 取 查看源码没有的 c#解决高并发 委托 c#日期转化为字符串 c# 显示问号 c# 字典对象池