Question

我有一些遗留的HTML需要适用于新旧浏览器（低至IE7）以及iPad。由于处理文本选择的方式，iPad是最大的问题。在页面上有一个textarea以及一些文本说明。说明位于<div>，用户需要能够选择说明。

问题是，一旦焦点放在textarea中，用户就无法随后选择<div>中的文字说明。这是因为文本无法获得焦点。

根据Safari Web内容指南：处理事件（特别是“使元素可点击”），您可以向想要获得焦点的div添加onclick事件处理程序。

此解决方案在iOS 6x中有效（虽然不太理想），但在iOS 5x中无效。

问题是，在输入控件具有焦点后，如何在页面上选择文本。这需要适用于iOS 5.1 +

以下是显示问题的示例代码。

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<script src="http://code.jquery.com/jquery-1.8.2.js"></script>

<!--
Resources:
    Safari Web Content Guide: Handling Events (especially, "Making Elements Clickable")
    https://developer.apple.com/library/archive/documentation/AppleApplications/Reference/SafariWebContent/HandlingEvents/HandlingEvents.html#//apple_ref/doc/uid/TP40006511-SW1
 -->
 </head>
<body>
<div style="width:550">
    <div onclick='console.debug("Click!"); void(0);'>
        <p>On the iPad, I want to be able to select this text after the textarea has had focus.</p>
    </div>
    <textarea rows="20" cols="80">After focus is in the textarea, can you select the text above?</textarea>

</div>
</body>
</html>

输入字段选择iOS 5与iOS 6后的移动Safari文本选择

0 个答案: