|
|

楼主 |
发表于 2023-1-4 18:18
|
显示全部楼层
代码:
- <style>
- #papa {
- margin: auto;
- width: 740px;
- height: 540px;
- border: 1px solid #ccc;
- box-sizing: border-box;
- position: relative;
- }
- #papa > textarea {
- position: absolute;
- padding: 10px;
- border: none;
- outline: none;
- resize: none;
- box-sizing: border-box;
- font: normal 16px/20px sans-serif;
- }
- #maintxtbox {
- width: calc(100% - 50px);
- height: 100%;
- left: 50px;
- background: #fff;
- white-space: nowrap;
- }
- #linetxtbox {
- width: 50px;
- height: 100%;
- text-align: right;
- background: #eee;
- overflow: hidden;
- }
- </style>
- <div id="papa">
- <textarea id="linetxtbox" disabled>1</textarea>
- <textarea id="maintxtbox"></textarea>
- </div>
- <script>
- let showLineIdx = (ele,e) => {
- let v = ele.value, lines = v.split('\n');
- let numAr = [...Array(lines.length).keys()].map((item,key) => key+1);
- linetxtbox.value = numAr.join('\n');
- linetxtbox.scrollTop = maintxtbox.scrollTop;
- }
- maintxtbox.oninput = (e) => {
- showLineIdx(maintxtbox,e);
- }
- maintxtbox.onscroll = () => linetxtbox.scrollTop = maintxtbox.scrollTop;
- </script>
复制代码
|
|