-webkit-appearance:none 在input控件上的设置体现

通常，IOS环境下的按钮都是经过美化的，但通常我们在设计web app的时候不需要这些看上去老土的样式，所以，去除这些显得很有必要。

-----------------------------------------------------------------------------------------------------------------------------------

下面这句代码就是重置这些样式的：

-webkit-appearance: none;

我们在写移动端的web开发时，会在common.css中添加以下CSS代码来：

input[type=button]{
	-webkit-appearance:none;
	outline:none
}

-----------------------------------------------------------------------------------------------------------------------------------

这个BUG发生的背景有点复杂。原因有如下两个：

1.大概就是一个form表单，要用Validation Plugin验证，Ajax提交。结果发现在Webkit浏览器下无论怎样都阻止这个form在提交的时候刷新整个页面。

2.若是单个或是多个单选按钮的话无法进行点击操作。

-----------------------------------------------------------------------------------------------------------------------------------

最后总算找到元凶是checkbox上的-webkit-appearance:none属性。

-webkit-appearance会将webkit浏览器中的元素默认样式去除。

radiao/checkbox在这个属性下就直接隐藏掉了。

然后用JS获取radio/checkbox值时Webkit浏览器会报很奇怪的错误。

给这个元素重新赋上-webkit-appearance:checkbox就不会报错了。

其他的的表单元素以及其他的情况并未测试。

这个问题在Chrome和Safari中都会出现，应该是Webkit引擎的问题。

-----------------------------------------------------------------------------------------------------------------------------------