鍍金池/ 問答/Java  PHP  Python  HTML/ textarea或者div,如何在拉伸的時候,只能高度變化,寬度不變,頁面刷新還

textarea或者div,如何在拉伸的時候,只能高度變化,寬度不變,頁面刷新還可以保存高度,如下圖和代碼

問題

1.textarea或者div
2.自由拉伸并且
3.頁面刷新還可以保存高度,
4.寬度保持不變

clipboard.png

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
    <style>
        textarea {
            display: block;
            width: 200px;
            margin-top: 40px;
        }
        
        div {
            display: block;
            width: 200px;
            margin-top: 40px;
            border: 1px solid #ccc;
            resize: vertical;
            overflow: auto;
        }
    </style>

</head>

<body>
    <textarea class="test"></textarea>
    <textarea class="test"></textarea>
    <textarea class="test"></textarea>


    <!-- <div class="test"></div>
    <div class="test"></div>
    <div class="test"></div> -->

</body>

</html>
<script src="https://cdn.bootcss.com/jquery/3.3.1/jquery.min.js"></script>
<script>
    $(function() {

        $(".test").each(function(index, ele) {

            $(this).css("height", localStorage.getItem(index))
            $(this).mouseup(function() {
                var Index = index;
                console.log(index)
                console.log($(this).outerHeight())
                localStorage.setItem(index, $(this).height());
            })
        })
    })
</script>
回答
編輯回答
夏夕

只能持久化保存高度數(shù)據(jù)了,比如放localStorage里面。

2017年5月14日 09:43