2009-02-24 2 views
1

, например, у меня есть следующий HTMLКак получить исходный текстовый узел события?

<HTML> 
<HEAD> 
<script type="text/javascript"> 
function trackElement(event){ 
    event=event||window.event; 
    var target = event.explicitOriginalTarget||event.srcElement||document.activeElement; 
    var targetText = target.nodeValue||target.innerHTML; 
    alert(targetText); 
} 
</script> 
</HEAD> 
<BODY onclick="trackElement(event)"> 
<div>bbbbbb<div>cccccc</div>dddddddddd<div>eeeeeeeee</div></div> 
</BODY> 
</HTML> 

Когда я нажал "BBBBBB",

  • На светлячок, я получил "bbbbbb" предупредил что это именно то, что я ожидал.

  • Но на IE, я получил "bbbbbb<div>cccccc</div>dddddddddd<div>eeeeeeeee</div>"

Когда я нажал "DDDDDDDDDD",

  • На светлячок, я получил "dddddddddd" насторожило что именно то, что I ожидается.

  • Но на IE, я получил "bbbbbb<div>cccccc</div>dddddddddd<div>eeeeeeeee</div>"

Как я могу получить тот же результат с светлячок на IE?

ответ

0

См. Комментарий об Explicitoriginaltarget в crossbrowser-equivalent-of-explicitoriginaltarget-event-parameter.

В IE вы получаете элемент Div, а второй находится в нем, делает ли это решение разделения divs для вас? - сценарий такой же ... (Это работает как в IE и FF)

<BODY onclick="trackElement(event)"> 
    <div>bbbbbb</div> 
    <div>cccccc</div> 
</BODY> 
+0

Спасибо Дрор, Но HTML я хочу, чтобы отслеживать это не генерировать сам, я не могу ожидать, что это может быть – user70228

1

Это потому, что свойство «nodeValue» возвращает нуль для узлов элементов, так что вы вернуть innerHtml вместо этого, который собирается содержать целое html-код внутри элемента. В Internet Explorer ваша цель назначается event.srcElement и, следовательно, является узлом элемента, тогда как это текстовый узел в FF. Один из способов решить эту проблему будет следующий код:

function trackElement(event){ 
    event=event||window.event; 
    var targetText; 
    var target = event.explicitOriginalTarget||event.srcElement||document.activeElement;   
    if(target.nodeType==3){ 
     targetText = target.nodeValue  
    }else{  
     targetText = target.firstChild.nodeValue; 
    } 
    alert(targetText); 
} 

Таким образом, вы бы вернуть значение, если ваше задание назначается текстовый узел, и текст первого ребенка (который является то, что вы после) для узла элемента.

EDIT: Оказывается, я ошибаюсь. Проблема в том, что event.srcElement возвращает весь элемент, на который нажимается (event.explicitOriginalTarget, являющийся специфичным для Mozilla). Оттуда вам нужно получить текст. Я не вижу легкого способа сделать это, если в элементе есть несколько текстов. Если есть только один, это вопрос итерации над дочерними узлами и отображения текстовых.

+0

Спасибо Axelle, но поскольку я не могу ожидать, что будет html, так что щелчок текстового узла может быть не первым ребенком. – user70228

+0

Действительно, извините. Фактически, event.srcElement извлекает _element_, который был нажат. Поэтому я думаю, что вам очень нужно то, что вы должны получить, чтобы быть включенным в элемент. Возможно, я ошибаюсь, я не большой эксперт JS. –

0

Как насчет того, чтобы просто подстроить его?

<script type="text/javascript"> 
function trackElement(event){ 
    event=event||window.event; 
    var target = event.explicitOriginalTarget||event.srcElement||document.activeElement; 
    var targetText = target.nodeValue||target.innerHTML.substr(0, target.innerHTML.indexOf("<")); 
    alert(targetText); 
} 
</script> 
</HEAD> 
<BODY onclick="trackElement(event)"> 
<div>bbbbbb<div>cccccc<p>Hellooo</p></div></div> 

Это похоже на работу, щелкая ccccc возвращает «cccccc» и т. Д. Или я полностью пропустил это?

EDIT: вам также нужно проверить, есть ли у элемента какие-либо дочерние элементы перед его подстановкой ...

+0

Спасибо peirix, я не описал свою ситуацию четко. В моем примере html не был неизменным. Может быть, любой html.Что я хочу, когда щелкнут любой текстовый узел html, я могу его получить. – user70228

0

наконец, я использую смещение, чтобы проверить, какой текст узла нажата, как показано ниже:

if ($.browser.mozilla) { 
    el = event.originalEvent.explicitOriginalTarget; 
}else{ 
    var parent =event.srcElement; 
    var left = event.pageX; 
    var top = event.pageY; 
    var offset=$(parent).offset(); 
    for(var i=0;i<parent.childNodes.length;i++){ 
     var n = parent.childNodes[i]; 
     if (n.nodeType == 1){ 
      if($(n).offset().top>offset.top){ 
       if($(n).offset().top>top){ 
        el=parent.childNodes[i-1]; 
        break; 
       } 
      }else if($(n).offset().top+$(n).height()>offset.top){ 
       if($(n).offset().left>left){ 
        el=parent.childNodes[i-1]; 
        break; 
       } 
      } 
     } 
     el=n; 
    } 
} 
Смежные вопросы