Html ajouter des numéros de ligne à textarea

J'ai un textarea comme dans le code ci-dessous, comment faire pour afficher le numéro de ligne de la main gauche côté d'elle.

Est-il un plugin jquery?

<TEXTAREA name="program" id="program" rows="15" cols="65" ></TEXTAREA>
  • Le code doit être présenté dans un textarea (c'est à dire modifiable) ou pourrait-il être présenté formaté comme un code dans un autre bloc?
InformationsquelleAutor Hulk | 2010-01-03
  1. 26

    Il est Doublée TextArea plugin pour jQuery par Alan Williamson

    Licence MIT

    jQuery 1.3+

    • Ce qui semble ne pas être compatible avec IE.
    • Le lien fonctionne maintenant et c'est très bon. Merci, techtonik!
    • ce plugin est très bon, mais ne fonctionne pas avec les textarea du "min-width" et "max-width" propriétés css. si il n'y a pas de "largeur", mais seulement "min-width", le plugin définit incorrect (environ 16 pixels de haut) largeur de la enveloppé textarea de sorte que le browser affiche les numéros de ligne au-dessus du texte.
    InformationsquelleAutor anatoly techtonik
  2. 7

    Vous pouvez très bien essayer
    Code Miroir, qui est une bibliothèque JavaScript pour intégrer un éditeur de code dans une page web.

    Avec des lignes de code, il a d'excellentes fonctionnalités comme

    • D'auto-complétion
    • Thèmes
    • De langue mixte modes
    • De recherche
    • De fusion/diff interface
    • Personnalisé barres de défilement etc.
    InformationsquelleAutor ChandrasekarG
  3. 2

    CodePress est celui utilisé dans WordPress.

    InformationsquelleAutor Mathias Bynens
  4. 2

    C'est très simple, mais efficace. Il insère une image avec les numéros de ligne déjà ajouté.

    Le seul hic, c'est que vous pouvez avoir besoin de créer votre propre image pour correspondre à votre conception de l'INTERFACE utilisateur.

    https://jsfiddle.net/vaakash/5TF5h/

    textarea {
    background: url(http://i.imgur.com/2cOaJ.png);
    background-attachment: local;
    background-repeat: no-repeat;
    padding-left: 35px;
    padding-top: 10px;
    border-color:#ccc;
}

    De crédit à la: Aakash Chakravarthy

    • On peut appeler qu'une solution, bien que j'appellerais cela un quick-fix
    • Cette solution n'est pas de faire défiler correctement. Aussi, si une ligne de texte est plus large que le textarea, il est renvoyé à la ligne. Cela signifie que le texte continue sur la ligne suivante, mais les numéros de ligne ne pourront pas suivre.
    InformationsquelleAutor Bern