iOS input[type=checkbox]打勾后不显示选中状态的问题

原创 已于 2022-04-13 12:41:09 修改 · 2.5k 阅读 · 1 ·
CC 4.0 BY-SA版权
本文系博主原创，转载请注明原文链接：Liberg的优快云博客
文章标签：

#checkbox #iOS checkbox #checkbox打勾不显示 #checkbox勾选不显示 #appearance

于 2022-02-22 10:31:14 首次发布
本文探讨了在Webkit内核浏览器中，当-webkit-appearance样式属性设置为none或auto导致的样式问题，并提供了将该属性恢复为checkbox的有效解决办法。

webkit内核浏览器样式设置的问题：

原因是，-webkit-appearance样式属性，被设置为了none或者auto。
解决办法：将-webkit-appearance属性设置为checkbox。

修改原生input[type=checkbox]样式 + 获取input[type=checkbox]状态
五花漏的博客
06-09 2142
HTML： <form> <input id="select" name="select" type="checkbox" checked> <label for="select"><i></i>选择</label> </form> CSS: input[type="checkbox"] { display: none;//隐藏原生的多选框 } input[type="checkbox"]+la
checkbox:一个用于替换 `input[type=checkbox]` 的 AngularJS 指令，以便它可以跨浏览器设置样式
06-15
注意：尽管此指令的操作方式与input[type=checkbox] ，但您不能在 Angular 上下文之外更改此指令的checked和disabled属性。 如果这些属性是使用例如 jQuery 的$.attr方法设置的，Angular 将不会获取更改，并且指令...
ios浏览器上，复选框checkbox默认选中或勾选时，不显示的问题
H_hanlinglingzi的博客
03-10 1598
检查input标签，css样式-webkit-appearance属性设置是否为none或auto 更改为checkbox
自定义 input[type="checkbox"]的样式
Bhys518的博客
12-15 1089
自定义 input[type=“checkbox”]的样式 对复选框自定义样式，我们以前一直用的脚本来实现，不过现在可以使用新的伪类 :checkbox 来实现。 如果直接对复选框设置样式，那么这个伪类并不实用，因为没有多少样式能够对复选框起作用。不过，倒是可以基于复选框的勾选状态借助组合选择符来给其他元素设置样式。 很多时候，无论是为了表单元素统一，还是为了用户体验良好，我们都会选择 label...
checkbox属性checked="checked"已有，但却不显示打勾的解决办法
热门推荐
anxin591025的专栏
09-29 2万+
在做权限管理的时候，做了一个功能，就是当勾选栏目，把所有的权限全勾上。刚开始使用了如下代码： function check(id,check) { if (check) { $("." + id).find("input[type='checkbox']").attr("checked", true); } else { $("." + id).find("input[type='c
checkbox不显示，试试去掉-webkit-appearance这个样式
JackieDYH的博客
03-11 756
自用的reset.css中加入了 -webkit-appearance: none;其他所有表单没有出现问题，但checkbox会不显示 说明： 改变按钮和其他控件的外观，使其类似于原生控件。 -webkit-appearance 是一个 不规范的属性（unsupported WebKit property），它没有出现在 CSS 规范草案中。 此属性非标准且渲染效果在不同浏览器下不同，...
ios 苹果 weui html的 radio checkbox单选框复选框无法选中无法点击 无效问题！
weixin_43341760的博客
10-22 1758
很不幸，再一次遇到这种问题，但已经忘记上次怎么解决的 首先百度说 label的for 和input 的id对应 已对应 首先看我的样式 代码 <div class="weui-cell bai-cell"> <div class="weui-cell__hd"><label>抬头类型</label></div> <div class="weui-cell__bd bai-flex ba
mui.css和input type=checkbox冲突，导致打不上勾(无法选中)的解决办法.zip
11-15
这个压缩包文件"mui.css和input type=checkbox冲突，导致打不上勾(无法选中)的解决办法.zip"显然是针对一个具体的技术问题，即MUI CSS框架与HTML复选框(input[type="checkbox"])之间存在兼容性问题，导致复选框无法...
jQuery操作 input type=checkbox的实现代码
12-12
input type=”checkbox”>: 2012欧洲杯”死亡之组”小组出线的国家队是： <input type=”checkbox” name=”nation” value=”Germany”>德国 <input type=”checkbox” name=”nation” value=”...
vue .js绑定checkbox并获取、改变选中状态的实例
10-18
`v-model`指令将`input[type=checkbox]`的选中状态与`item.state`绑定，当用户点击复选框时，`item.state`的值会自动更新。同时，`v-on:click`监听点击事件，调用`CheckItem`方法，传入当前循环的`item`对象。 下面...
input中type=“checkbox“样式突然不展示加改变原有样式解决方法
weixin_33210601的博客
08-18 979
讲解了input中type="checkbox"样式突然不展示的原因，加上如何把原有的样式改成圆形
＜input type=“checkbox“/＞在页面不显示
qq_40664253的博客
11-30 3120
type为checkbox的input写在.vue文件里，但在页面上不显示，检查发现就在页面上但是肉眼看不见。。。将这行代码随便放到一个.html文件里又显示正常 <input type="checkbox" v-model="item.flag"/> 最后在.vue文件里给它加了样式正常显示 template： <input type="checkbox" class="checkbox-input" v-model="item.flag" /> style: .check
boostrap中CheckBox的无法选中的问题
baidu_41904590的博客
01-04 2146
这两天在做项目的时候遇到这种在bootstrap框架中用CheckBox标签添加复选框无法选择的问题，所有整理了这篇笔记大家共同学习。 复选框无法选中可以给该复选框添加click事件 例： function checkboxClick(scope) { if ($(scope).is(":checked")) { $(scope).prop("checked", true); ...
18-解决克隆input复选框节点(type=“checkbox“)文字不显示问题
我们的目标是星辰大海！
08-31 503
18-解决克隆input复选框节点(type="checkbox")文字不显示问题
完美解决input 类型checkbox复选框不显示的问题
请告诉他
01-08 9357
问题：谷歌浏览器下，checkbox复选框不现实出来 F12查看 实际界面显示 问题分析：可能是样式冲突或者其他，f12查看样式如下 将margin:0px；去掉，加入 -webkit-appearance: checkbox 具体如下 最终效果： ...
iphone 实现CHeckBox
juce的专栏
07-17 1187
在iphone开发中,需要用到自动登录，或者记住密码，这些基本设置；而UILit不提供类似的CheckBox;那么就自己实现一个吧， 实现很简单，继承一个UIButton;添加一个BOLL属性ischecked;同时增加需要响应的目标和目标函数; view sourceprint?#import    @interface BECheckBox : UIButton {   BOOL is
checkbox属性checked="checked"已有，但复选框却不显示选中的原因
anjujiao1678的博客
03-31 875
复选框绑定了click事件后，本来应该是点一次选中，再点击取消选中，依次类推。 但今天在用谷歌测试全选复选框的时候，前两次都没有问题，可以正常显示选中和取消，但当再去选中的时候，复选框的属性checkbox值变为"checked"，没问题，但是复选框却不显示选中状态，明明属性值改了，但是却不显示勾选，用removeAttr吧属性去掉也不行,太诡异了。 代码修改了却得不到正确的显示状态...
input checkbox有checked='checked'还是没选中
Gary Leong
03-13 1342
如果用jQuery来写的话： 应该是用 (element).prop(‘checked′,true/false);而不是(element).prop(‘checked′,true/false);而不是(element).prop(‘checked’, true/false); 而不是 (element).attr(‘checked’, true/false); 如果我这么讲，也许你就...
checkbox显示为checked="checked"但是不显示选中状态
lobinsonCJX的博客
02-15 6349
if (!publicFlag.is(':checked')) { publicFlag.attr("checked", true); } 使用如上代码对checkbox进行选中操作时，会导致checkbox的checked状态为checked但是页面不显示为选中状态。 在使用的过程中，第一次使用这个属性的时候生效了，但是
input type=checkbox 用法
最新发布
04-25
好的，我现在需要回答用户关于HTML中input type=checkbox的用法、示例和属性的问题。首先，我需要回忆HTML中复选框的基本知识，并结合用户提供的引用内容来组织回答。 根据引用内容，特别是引用[2]和引用[4]，复选...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值