Подсчитать элемент до смещения

0

У меня есть такие коды:

<div id="content">
<span class="pivot">1</span>
Some pure text here
<span class="pivot">2</span>
Some pure text here
<span class="pivot">3</span>
Some pure text here
<span class="pivot">4</span>
TEXT FOR SELECTION
<span class="pivot">5</span>
Some pure text here
</div>

Моя проблема:

  • Я выбираю текст "ТЕКСТ ДЛЯ ВЫБОРА" с помощью мыши
  • Я хочу подсчитать, сколько пролетов класса PIVOT перед текстом для выбора

Кто-нибудь может мне помочь?

Теги:

2 ответа

0
Лучший ответ

Вам просто нужно изменить свой HTML следующим образом:

<div id="content" onmouseup="selectText()">
<span class="pivot">1</span>
Some pure text here
<span class="pivot">2</span>
Some pure text here
<span class="pivot">3</span>
Some pure text here
<span class="pivot">4</span>
TEXT FOR SELECTION
<span class="pivot">5</span>
Some pure text here
</div>

и вам нужно написать скрипт:

function selectText(element) {
        if (window.getSelection) {
            var selection = window.getSelection();  
            if(selection.extentNode.data.trim() == "TEXT FOR SELECTION"){
                var counter = 0;
                var a = $('#content')[0].childNodes;
                for(var i=0;i<a.length;i++){                
                    var check=a[i];
                    if(check.data != undefined && check.data.trim() == "TEXT FOR SELECTION"){
                        break;
                    }
                    if(check.data == undefined)
                        counter++;
                }
                alert(counter);
            }        
        }
    }

Вы получите количество тегов span в предупреждении.

  • 0
    Ну, это действительно мило. Но если я выбираю текст где-то еще, а не ТЕКСТ ДЛЯ ВЫБОРА, как я могу это сделать?
  • 0
    Хорошо. Я справился с этим. Спасибо за помощь. :)
0

Каждый элемент, текст или диапазон, является дочернимNode. Поэтому, если вы получите индекс childNode, который вы выберете и вычтите 1, вы получите ответ. Однако я не уверен, есть ли способ поймать, если мышь входит в childNode.

Поэтому я думаю, что лучше всего вы окружаете все элементы с помощью span, а затем добавляете onMouseOver="getIndex(this)" для получения индекса дочернего элемента.

function getIndex(child){
    var children = document.getElementById("content").children;

    for(i = 0; i < children.length; i++)
        if(child == children[i])
        alert("Element number " + i)
}

и контент будет похож;

<div id="content">
    <span class="pivot" onmouseover="getIndex(this)">1</span>
    <span onmouseover="getIndex(this)">Some pure text here</span>
    <span class="pivot" onmouseover="getIndex(this)">2</span>
    <span onmouseover="getIndex(this)">Some pure text here</span>
    <span class="pivot" onmouseover="getIndex(this)">3</span>
    <span onmouseover="getIndex(this)">Some pure text here</span>
    <span class="pivot" onmouseover="getIndex(this)">4</span>
    <span onmouseover="getIndex(this)">TEXT FOR SELECTION</span>
    <span class="pivot" onmouseover="getIndex(this)">5</span>
    <span onmouseover="getIndex(this)">Some pure text here</span>
</div>
  • 0
    Оппс, я не хочу оборачивать его тегом span. Я просто хочу определить, сколько разметки перед текстом я выбрал.

Ещё вопросы

Сообщество Overcoder
Наверх
Меню