在我制作的html页面中,我尝试使用html和css使div可点击。在一些主要的浏览器(Chrome,Firefox,Opera,Safari)以及HTC手机中,该功能都可以完美运行,但是当我尝试在Iphone上对其进行测试时,我发现它根本无法正常工作。复选框本身甚至无法选择。
这是我的代码(除了在Iphone上工作):
HTML:
<div class="" style="height: 30px;"> <div style="display: table; width: 100%;"> <div style="display: table-row; width: 100%;"> <div style="display: table-cell;"> <label for="3171">Text....</label> </div> <div style="display: table-cell; text-align: right;"> <input type="checkbox" id="3171" name="3171"> </div> </div> </div> <label for="3171"> <span class="blocklink">Invisible text</span> </label> </div>
CSS:
.blocklink { display: block; height: 100%; left: 0; overflow: hidden; position: absolute; text-indent: -999em; top: 0; width: 100%; }
因此,正如您所看到的,我使用的技术基本上只是<label>在整个父级上展开,div因此您单击的任何地方都将选中/取消选中链接的复选框。
<label>
div
不幸的是,这在iPhone上不起作用。是否可以以某种方式继续使用此技术,同时提供IPhone支持?(最好不要使用JavaScript,因为我真的不愿意只使用HTML和CSS)
提前致谢,
Arne
添加一个空onclick=""的标签再次使上IOS4元素点击。似乎默认情况下,按住复制和粘贴文本机制会阻止或替代该操作。
onclick=""
<label for="elementid" onclick="">Label</label>