0
点赞
收藏
分享

微信扫一扫

weui 弹出 $.toast(“我是文本“,“text“); 总是带有图标


在前段代码中引入 weui.css ,weuix.css 和js jquery-weui.min.js就可以使用weui的一些样式了

按照官方的文档中

                 $.toast("我是文本","text");

弹出的样式应该如下:

                 

weui 弹出 $.toast(“我是文本“,“text“); 总是带有图标_toast

但是我在实际中使用弹出的结果却是这个样子:

weui 弹出 $.toast(“我是文本“,“text“); 总是带有图标_toast_02

为什么

原因肯定是weui的样式和其他的样式冲突了

我们看看 $.toast 这一串代码:

t.toast=function(t,a,r)
{ "function"==typeof a&&(r=a);
var o,s="weui-icon-success-no-circle",
c=i.duration;
"cancel"==a?(o="weui-toast_cancel",s="weui-icon-cancel"):"forbidden"==a?(o="weui-toast--forbidden",s="weui-icon-warn"):"text"==a?o="weui-toast--text":"number"==typeof a&&(c=a),
e('<i class="'+s+' weui-icon_toast"></i><p class="weui-toast_content">'+(t||"已经完成")+"</p>",o),setTimeout(function(){n(r)},c)}

大概能看出来 cancel ,forbidden,text 这些都是一些选项,当选择而不同的时候,出现不同的样式

text 应该是没有图标,为什么有图标了

weui 弹出 $.toast(“我是文本“,“text“); 总是带有图标_ico_03

我在页面上设置100,来查看这个样式

weui 弹出 $.toast(“我是文本“,“text“); 总是带有图标_css_04

可以看到的是图标来源于这一部分

我们选中 i 这个标签,看右侧使用的样式:

weui 弹出 $.toast(“我是文本“,“text“); 总是带有图标_css_05

 

果然是其他的样式干扰的

如果我们引入的其他的css作用不大,我们可以找到直接删除了

或者将 important 删除了

weui 弹出 $.toast(“我是文本“,“text“); 总是带有图标_weui_06

最终结果:

weui 弹出 $.toast(“我是文本“,“text“); 总是带有图标_weui_07

因为这次的样式调试用了很长的时间,特此记录

希望对你有所帮助

 

 

 

举报

相关推荐

0 条评论