HTML：如何在iOS设备中复制只读文本区域

如何在iOS设备上使

文本区域

和

输入类型=“text”

可高亮显示和可复制

这不起作用：

<textarea readonly="readonly">Totally readonly, cannot be copied</textarea>

完全只读，无法复制

也没有：

<textarea disabled="disabled">Totally readonly, cannot be copied</textarea>

完全只读，无法复制

编辑：文本区域不断更新，因此一次性转换将不起作用

textarea的内容也可以是HTML

---

我在一个JSFIDLE上测试了这一点：

一个解决方案是找到页面上的所有只读文本区域，并呈现一个包含内容的div来代替只读字段。我写了一些非常简单的JS来演示这一点

类似于

$('textarea[readonly]').removeAttr('readonly').each(function () {
    var $this = $(this);
    $this.hide().after('<div data-textarea="' + $this.attr('id')
        + '" class="textarea">' + $this.val() + '</div>');
}).on('textareachange', function () {
    var $this = $(this);
    $('[data-textarea="' + $this.attr('id') + '"]').html($this.val());
});

这里有一个更广泛的例子，包括样式等方面的例子

---

我成功地在iPhone上选择了一些文本，但需要多次尝试

<textarea readonly onfocus="this.blur();">Totally readonly, CAN BE copied</textarea>

完全只读，可以复制

最后一点：

普通div

普通分区

---

iPhone上易于选择的文本同样遇到了这个问题

我不确定下面这句话是否合适、正确或是语义上的选择，但它对我很有用

我只是简单地将textarea更改为div readonly，应用了相同的样式

一个缺点是，在JavaScript中，我无法使用这个['myForm']作为div的目标。它似乎不是DOM中form元素的子元素

相反，我必须按id获取元素并将其设置为innerHTML，而不是按textarea设置值

---

它在Ipad 1 IOS5和Iphone 4s IOS7上运行，我现在可以选择文本并将其复制到剪贴板。

您只想阻止用户修改文本，同时保持文本的可选择性和可复制性？@Hejazi是的，这是正确的！你可以在文本视图上放置一个不可见的按钮来复制文本，或者在它旁边放置一个按钮，上面写着“复制”。@AMayes如果没有闪光灯，这个按钮不是什么都做不了吗？@Seb Nilsson，嗯，什么？除非你说的“flash”是指“Objective-C”，否则你的问题是没有意义的。如果不是因为我的问题有限制的话，这是可行的。更新了问题，抱歉。Seb您的编辑有一个功能，但在更新了JSFIDLE的代码段中没有，并且在使用最新iOS的iPhone 5上不起作用。你可以从一个部门复制从来都不是问题。

<textarea readonly onfocus="this.blur();">Totally readonly, CAN BE copied</textarea>

<div>
    <label>Plain div</label><br />
    <div id="plain-div" onFocus="this.blur();">
        Plain div
    </div>
</div>