一尘不染

HTML 命令在Iphone浏览器中不起作用

css

在我制作的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因此您单击的任何地方都将选中/取消选中链接的复选框。

不幸的是,这在iPhone上不起作用。是否可以以某种方式继续使用此技术,同时提供IPhone支持?(最好不要使用JavaScript,因为我真的不愿意只使用HTML和CSS)

提前致谢,

Arne


阅读 414

收藏
2020-05-16

共1个答案

一尘不染

添加一个空onclick=""的标签再次使上IOS4元素点击。似乎默认情况下,按住复制和粘贴文本机制会阻止或替代该操作。

<label for="elementid" onclick="">Label</label>
2020-05-16