JavaScript - 在 textarea 中，双击选择所有文本

最新推荐文章于 2023-08-01 18:46:19 发布

好好活着，不要熬夜

最新推荐文章于 2023-08-01 18:46:19 发布

阅读量1.1k

点赞数

分类专栏： HTML & CSS & JavaScript 文章标签： javascript html html5

本文链接：https://blog.csdn.net/qq_29761395/article/details/120665564

版权

HTML & CSS & JavaScript 专栏收录该内容

66 篇文章 1 订阅

订阅专栏

文章目录

示例
参考

示例

谷歌浏览器：版本 94.0.4606.71（正式版本）

在这里插入图片描述

默认情况下，在 textarea 中，双击无法选择所有的文本。不过，可在相应元素的 dblclick 事件处理程序中调用 HTMLInputElement.select() 方法达到这种效果：

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8" />
        <title></title>
        <style type="text/css">
            textarea {
                width: 300px;
                height: 400px;
            }
        </style>
    </head>
    <body>
        <textarea id="with" placeholder="双击可以选中所有内容"></textarea>
        <textarea id="without" placeholder="双击无法选中所有内容"></textarea>

        <script type="text/javascript">
            window.onload = function(event) {
                // console.log(event)
                main()
            }

            function main() {
                const textarea = document.querySelector("#with")

                textarea.ondblclick = (event) => {
                    // console.log(event)
                    event.target.select()
                }
            }
        </script>
    </body>
</html>

参考

Web technology for developers > Web APIs > HTMLInputElement > HTMLInputElement.select()

好好活着，不要熬夜

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
JavaScript - 在 textarea 中，双击选择所有文本

文章目录示例参考示例谷歌浏览器：版本 94.0.4606.71（正式版本）默认情况下，在 textarea 中，双击无法选择所有的文本。不过，可以使用 HTMLInputElement.select() 方法达到这种效果：<!DOCTYPE html><html> <head> <meta charset="utf-8" /> <title></title> &lt
复制链接

扫一扫