номера строк для содержимого редактируемого div - PullRequest
Новая
       75

номера строк для содержимого редактируемого div

0 голосов
/ 13 апреля 2020

Я пытаюсь показать номера строк в div, который является спорным. Таким образом, содержимое не является c и может быть отредактировано как обычный редактор. До сих пор я мог добавлять номера строк, но когда я добавляю новые строки или удаляю строку, она не работает должным образом.

Вот код. 

#textarea {
    outline: 0px solid transparent;
    padding: 10px 16px;
    counter-reset: line;
}
#textarea .lines {
  display: block;
}
#textarea .lines:before {
  counter-increment: line;
  content: counter(line);
  display: inline-block;
  border-right: 1px solid #ddd;
  margin-right: .5em;
  color: #888
}
<div placeholder="Type here..." id="textarea" style="font-size:20px;resize: inline;width: 100%;margin-top: 0px; border: 1px solid #ddd;height: 89vh;overflow-y: auto;" spellcheck="false" contenteditable="">
<span class="lines">India win series 2-1 in the series decider</span>
<span class="lines">India chases a tricky 300+ score at Cuttack with the top 3 contributing once again with their half-centuries. Captain Virat Kohli was adjudged man of the match for his vital 85 runs which indeed guided the team when the openers departed after a century-plus stand.</span>
<span class="lines">Also, Rohit Sharma was awarded man of the series and he also end has the highest run-getter in ODIs this year. Earlier West Indies scored 100+runs in their last 10 overs to set a target of 316 for the hosts to chase. Pollard and Pooran had 100plus stand in quick time to take West Indies to a formidable total.</span>
<span class="lines"></span>
<span class="lines"></span>
</div>

**

Поэтому я хочу решить эту проблему, объединяя две строки и вставляя новую строку в contenteditable

...