Bagaimana untuk Menambah Nombor Baris ke Textarea HTML?

Memaparkan Nombor Baris dalam Kawasan Teks HTML

Apabila bekerja dengan elemen, adalah berfaedah untuk memaparkan nombor baris di sepanjang jidar kirinya untuk kebolehbacaan dan penyahpepijatan kod yang dipertingkatkan.</p> <p><strong>CodeMirror sebagai Penyelesaian</strong></p> <p>CodeMirror ialah perpustakaan editor kod yang berkuasa yang boleh dimanfaatkan untuk menambah nombor baris pada <textarea>. Dokumentasinya yang luas memberikan panduan terperinci untuk pelaksanaannya.</p> <p><strong>Demo Pelaksanaan</strong></p> <p>Demo berfungsi sepenuhnya boleh didapati dalam kotak pasir StackOverflow:</p> <p><strong>Sumber Tambahan</strong></p> <p>Untuk bantuan lanjut dan pilihan penyesuaian, rujuk sumber berikut:</p> <ul> <li>Dokumentasi CodeMirror: https://codemirror.net/doc/ </li> <li>CSS untuk CodeMirror: https://codemirror.net/doc/manual.html#styling</li> </ul><p>Atas ialah kandungan terperinci Bagaimana untuk Menambah Nombor Baris ke Textarea HTML?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!</p></div><div class="nphpQianMsg"><a href="javascript:void(0);">css</a> <a href="javascript:void(0);">html</a> <a href="javascript:void(0);">for</a> <a href="javascript:void(0);">display</a> <a href="javascript:void(0);">margin</a> <a href="javascript:void(0);">https</a><div class="clear"></div></div><div class="nphpQianSheng"><span>Kenyataan：</span><div>Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn</div></div></div><div class="nphpSytBox"><span>Artikel sebelumnya：<a class="dBlack" title="Petua Tailwind: Mengurus senarai panjang kelas utiliti dalam satu baris kod" href="https://m.php.cn/ms/faq/1796684561.html">Petua Tailwind: Mengurus senarai panjang kelas utiliti dalam satu baris kod</a></span><span>Artikel seterusnya：<a class="dBlack" title="Petua Tailwind: Mengurus senarai panjang kelas utiliti dalam satu baris kod" href="https://m.php.cn/ms/faq/1796684613.html">Petua Tailwind: Mengurus senarai panjang kelas utiliti dalam satu baris kod</a></span></div><div class="nphpSytBox2"><div class="nphpZbktTitle"><h2>Artikel berkaitan</h2><em><a href="https://m.php.cn/ms/article.html" class="bBlack"><i>Lihat lagi</i><b></b></a></em><div class="clear"></div></div><ins class="adsbygoogle" style="display:block" data-ad-format="fluid" data-ad-layout-key="-6t+ed+2i-1n-4w" data-ad-client="ca-pub-5902227090019525" data-ad-slot="8966999616"></ins><script> (adsbygoogle = window.adsbygoogle || []).push({}); </script><ul class="nphpXgwzList"><li><b></b><a href="https://m.php.cn/ms/faq/841.html" title="Ringkasan perkara yang perlu anda perhatikan tentang Border semasa menulis CSS" class="aBlack">Ringkasan perkara yang perlu anda perhatikan tentang Border semasa menulis CSS</a><div class="clear"></div></li><li><b></b><a href="https://m.php.cn/ms/faq/961.html" title="Bagaimana untuk merealisasikan pemilihan berbilang gaya dan penukaran masa nyata gaya_Pertukaran pengalaman" class="aBlack">Bagaimana untuk merealisasikan pemilihan berbilang gaya dan penukaran masa nyata gaya_Pertukaran pengalaman</a><div class="clear"></div></li><li><b></b><a href="https://m.php.cn/ms/faq/1345.html" title="Analisis penggunaan terperinci marquee" class="aBlack">Analisis penggunaan terperinci marquee</a><div class="clear"></div></li><li><b></b><a href="https://m.php.cn/ms/faq/269082.html" title="CSS标题线（删除线贯穿线效果）实现" class="aBlack">CSS标题线（删除线贯穿线效果）实现</a><div class="clear"></div></li><li><b></b><a href="https://m.php.cn/ms/faq/269606.html" title="CSS3中优雅降级和渐进增强的区别" class="aBlack">CSS3中优雅降级和渐进增强的区别</a><div class="clear"></div></li></ul></div></div><ins class="adsbygoogle" style="display:block" data-ad-format="autorelaxed" data-ad-client="ca-pub-5902227090019525" data-ad-slot="5027754603"></ins><script> (adsbygoogle = window.adsbygoogle || []).push({}); </script><footer><div class="footer"><div class="footertop"><img src="/static/imghwm/logo.png" alt=""><p>Latihan PHP dalam talian kebajikan awam，Bantu pelajar PHP berkembang dengan cepat！</p></div><div class="footermid"><a href="https://m.php.cn/ms/about/us.html">Tentang kita</a><a href="https://m.php.cn/ms/about/disclaimer.html">Penafian</a><a href="https://m.php.cn/ms/update/article_0_1.html">Sitemap</a></div><div class="footerbottom"><p> © php.cn All rights reserved </p></div></div></footer><script>isLogin = 0;</script><script type="text/javascript" src="/static/layui/layui.js"></script><script type="text/javascript" src="/static/js/global.js?4.9.47"></script></div><script src="https://vdse.bdstatic.com//search-video.v1.min.js"></script><link rel='stylesheet' id='_main-css' href='/static/css/viewer.min.css' type='text/css' media='all'/><script type='text/javascript' src='/static/js/viewer.min.js?1'></script><script type='text/javascript' src='/static/js/jquery-viewer.min.js'></script><script>jQuery.fn.wait = function (func, times, interval) { var _times = times || -1, //100次 _interval = interval || 20, //20毫秒每次 _self = this, _selector = this.selector, //选择器 _iIntervalID; //定时器id if( this.length ){ //如果已经获取到了，就直接执行函数 func && func.call(this); } else { _iIntervalID = setInterval(function() { if(!_times) { //是0就退出 clearInterval(_iIntervalID); } _times <= 0 || _times--; //如果是正数就 -- _self = $(_selector); //再次选择 if( _self.length ) { //判断是否取到 func && func.call(_self); clearInterval(_iIntervalID); } }, _interval); } return this; } $("table.syntaxhighlighter").wait(function() { $('table.syntaxhighlighter').append("<p class='cnblogs_code_footer'><span class='cnblogs_code_footer_icon'></span></p>"); }); $(document).on("click", ".cnblogs_code_footer",function(){ $(this).parents('table.syntaxhighlighter').css('display','inline-table');$(this).hide(); }); $('.nphpQianCont').viewer({navbar:true,title:false,toolbar:false,movable:false,viewed:function(){$('img').click(function(){$('.viewer-close').trigger('click');});}}); </script></body><!-- Matomo --><script> var _paq = window._paq = window._paq || []; /* tracker methods like "setCustomDimension" should be called before "trackPageView" */ _paq.push(['trackPageView']); _paq.push(['enableLinkTracking']); (function() { var u="https://tongji.php.cn/"; _paq.push(['setTrackerUrl', u+'matomo.php']); _paq.push(['setSiteId', '9']); var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0]; g.async=true; g.src=u+'matomo.js'; s.parentNode.insertBefore(g,s); })(); </script><!-- End Matomo Code --></html>