Bagaimanakah cara saya menambah nombor baris ke kawasan teks HTML menggunakan CodeMirror?

Cara Menambah Nombor Baris pada HTML Textarea

Dalam perbincangan StackOverflow ini, pengguna mencari penyelesaian untuk menambah nombor baris pada jidar kiri elemen textarea. Pengguna memberikan coretan kod berikut:

<TEXTAREA name="program">

Walaupun perpustakaan CodeMirror yang disyorkan menawarkan penyelesaian yang berkesan, persoalan timbul tentang butiran teknikalnya.

CodeMirror: A Powerful Text Editor

CodeMirror ialah editor teks serba boleh yang disepadukan dengan lancar ke dalam aplikasi web. Untuk memasukkannya ke dalam kawasan teks anda, cuma ikut langkah berikut:

var editor = CodeMirror.fromTextArea(document.getElementById('code'), {
    lineNumbers: true,
    mode: 'text/x-perl',
    theme: 'abbott',
});

Coretan ini memulakan tika CodeMirror dalam elemen dengan ID "kod." Pilihan "lineNumbers" membolehkan paparan nombor baris, dan pilihan "mod" dan "tema" menyesuaikan penyerlahan kod dan tema, masing-masing.

Demo dan Dokumentasi

Untuk demonstrasi yang berfungsi, rujuk coretan berikut:

var editor = CodeMirror.fromTextArea(document.getElementById('code'), {
    lineNumbers: true,
    mode: 'text/x-perl',
    theme: 'abbott',
});

<script language="javascript" type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/codemirror/6.65.7/codemirror.min.js"></script>
<script language="javascript" type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/codemirror/6.65.7/mode/perl/perl.min.js"></script>

<link rel="stylesheet" type="text/css" href="https://cdnjs.cloudflare.com/ajax/libs/codemirror/6.65.7/codemirror.min.css">
<link rel="stylesheet" type="text/css" href="https://cdnjs.cloudflare.com/ajax/libs/codemirror/6.65.7/theme/abbott.min.css">

<textarea>

Untuk butiran lanjut dan pilihan penyesuaian lanjutan, terokai dokumentasi komprehensif di https://codemirror.net/doc/.

Atas ialah kandungan terperinci Bagaimanakah cara saya menambah nombor baris ke kawasan teks HTML menggunakan CodeMirror?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!