Bagaimanakah Saya Boleh Menggayakan Teks Dalam Elemen Textarea?

Menyesuaikan Pemformatan Teks Area Teks

Textareas menawarkan kelebihan yang wujud seperti bar skrol, tetapi bagaimana jika anda perlu menggayakan bahagian teks tertentu dalam

Tidak Dapat Memformat Elemen dalam </p> <p>Walaupun kelihatan intuitif untuk membenamkan <span> tag untuk pemformatan teks, standard <textarea> elemen tidak menyokong fungsi ini secara asli. Ia direka untuk kandungan teks biasa, bukan pemformatan kaya.</p> <p><strong>Gunakan "Fake Textarea" dengan contenteditable</strong></p> <p>Untuk mencapai pemformatan teks yang boleh disesuaikan, pertimbangkan untuk menggunakan "fake textarea "pendekatan. Laksanakan <div> elemen dengan atribut contenteditable, yang membolehkan anda mengedit kandungan dalam div.</p> <pre class="brush:php;toolbar:false"><div></pre> <p><strong>Menyesuaikan "Fake Textarea"</strong></p> <p>"fake textarea" membenarkan penyesuaian yang lebih besar:</p> <ul> <li>Tetapkan bar skrol menggunakan limpahan CSS harta.</li> <li>Gunakan elemen ini dalam bentuk seperti kawasan teks biasa.</li> </ul> <p><strong>Contoh dengan jQuery</strong></p> <p>Untuk menyerahkan kandungan "palsu anda textarea" dalam permintaan POST, anda boleh menggunakan jQuery:</p> <pre class="brush:php;toolbar:false"><input type="hidden"></pre> <pre class="brush:php;toolbar:false">$('#your_form').submit(function() { $('#fake_textarea_content').val($('#fake_textarea').html()); });</pre><p>Atas ialah kandungan terperinci Bagaimanakah Saya Boleh Menggayakan Teks Dalam Elemen Textarea?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!</p></div><div class="nphpQianMsg"><a href="javascript:void(0);">jquery</a> <a href="javascript:void(0);">css</a> <a href="javascript:void(0);">if</a> <a href="javascript:void(0);">for</a> <a href="javascript:void(0);">while</a> <a href="javascript:void(0);">format</a> <a href="javascript:void(0);">using</a> <a href="javascript:void(0);">Attribute</a> <a href="javascript:void(0);">Property</a> <a href="javascript:void(0);">this</a> <a href="javascript:void(0);">overflow</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="Bagaimana Peraturan @media Bersarang Berfungsi dalam CSS dan Apakah Sokongan Penyemak Imbas Wujud?" href="https://m.php.cn/ms/faq/1796712492.html">Bagaimana Peraturan @media Bersarang Berfungsi dalam CSS dan Apakah Sokongan Penyemak Imbas Wujud?</a></span><span>Artikel seterusnya：<a class="dBlack" title="Bagaimana Peraturan @media Bersarang Berfungsi dalam CSS dan Apakah Sokongan Penyemak Imbas Wujud?" href="https://m.php.cn/ms/faq/1796712499.html">Bagaimana Peraturan @media Bersarang Berfungsi dalam CSS dan Apakah Sokongan Penyemak Imbas Wujud?</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></html>