매우 긴 단락이 있다고 가정 해 봅니다. 줄을 클릭하면 JS/jQuery는이 특정 줄의 시작 부분에이 줄의 첫 단어 바로 앞에 빈 <span> 태그를 추가합니다.JavaScript가있는 단락에서 단어 줄 번호 찾기
f.e : 나는이 두 번째 줄을 클릭하면
<p>
It is a long established fact that a reader will be distracted by the readable content of a page when looking at its layout. The point of using Lorem Ipsum is that it has.
</p>
가하는 <span> 태그가 두 번째 행의 첫 단어 앞에 삽입한다 : 이것은 내 단락입니다.
아이디어가 있습니까?
jQuery는 하드 코딩 된 줄 바꿈 (<br /> 또는 그와 비슷한)이 발생하지 않는 한 줄 바꿈 된 줄을 발견 할 수 없습니다.
작은 해킹이지만 한 가지 옵션이 있습니다.
.lastIndexOf(' ') 사용) (즉 그것이 0 높이를 얻을 수 있으므로 display:none를 사용하지 않고는 보이지하려면)-3000의 left 보내기 용기 복제 및 측정 매번 높이. .substring(0, position) + '<span>' + .substring(position)좋은 생각, 고마워. 하지만 성능은 어떻습니까? 문단이 매우 길다는 것을 고려해 볼 때, 각 클릭에 대해 단락에서 각 단어를 전달해야 할 경우 사용자가 해고 될 수 있음을 의미합니다. – dsternlicht
@fastrd'p .'의'.length'를 먼저 비교하여 변경된 경우 - 다시 실행하는 데 의미가 없습니다. 당신은 또한 para의 정면에서 가서 새로운 para에 단어를 넣고 그것이 성장할 때를 보게됩니다 (이것은 당신의 새로운 라인을 나타낼 것입니다). 그렇게하면 첫 번째 줄만 지나갈 수 있습니다. 원본을 복제하고, 내용을 비우고, 화면 밖으로 보내고, 원본 파라의 단어를 추가하십시오. – Joe
안녕 친구 당신은 찾을 수 있습니다 - 그것은 작은 비 제로 높이로 크기를 조정하면 당신은 그럼, 당신의 <span>를 삽입 할 위치, 즉 방금 발견 한 위치에
.substring() ...입니다 가능한 다음 링크에서 여기에이 방법으로 문제가 해결 Get caret position in contentEditable div
희망을 복제.
그래서 컨테이너 요소에 의해 적용되는 줄 바꿈으로 결정되는 줄은? –
하드 라인 브레이크 ('
')를 사용하지 않는 한, 나는 할 수 있다고 생각하지 않습니다. –