Question

我在网站上使用了很多textareas，但它们不是只读的，并且需要花费大量时间才能将readonly属性添加到所有这些属性中。有没有其他方法可以让它们都是只读的？

Answer 1

您可以 *使用JavaScript选择页面上的所有textarea并循环浏览该集合，并将readonly属性设置为true。< / p>

/** ES6 VERSION **/
{
  let textareas=document.getElementsByTagName("textarea"),
      x=textareas.length;
  while(x--)
    textareas[x].readOnly=1;
}
/** ES5 VERSION
(function(){
  var textareas=document.getElementsByTagName("textarea"),
      x=textareas.length;
  while(x--)
    textareas[x].readOnly=1;
})();
**/

<textarea></textarea>
<textarea></textarea>
<textarea></textarea>

*我说可以，因为所有人都必须做的是在浏览器中禁用JavaScript以解决此问题。更好的解决方案是在代码中“手动”设置每个readonly的{{1}}属性，但是，任何真正想要绕过它的人仍然可以通过浏览器的dev来实现。控制台。

Answer 2

使用VanillaJS，您可以使用以下代码：

var list = document.getElementsByTagName("textarea");

for (var i = 0; i < list.length; i++) {
    list[i].readOnly = true;
}

使用jQuery：

$('textarea').attr('readonly', true);

Answer 3

您可以在所有textareas元素周围放置一个字段集并禁用字段集：

var myFieldset = document.getElementById("fieldset");
disableAll.onclick = function () { myFieldset.disabled = true; }
enableAll.onclick = function () { myFieldset.disabled = false; }

<button id="disableAll">Disable all</button>
<button id="enableAll">Enable all</button>

<form>
    <fieldset id="fieldset">
        <div>
            <input type="text" value="sample text"/>
        </div>
        <div><textarea>your textarea</textarea></div>
        <div><input type="button" value="a button"/></div>
    </fieldset>
</form>

使用jQuery，你可以使用类似的东西：

$('input[type=text], textarea').attr('readonly', true);

如何使网站上的所有textareas“只读”

3 个答案: