Подчеркните слова при наведении курсора через X секунд

Question

Я пытаюсь сделать следующее: при наведении курсора на любое слово в тексте, скажем, на две секунды, оно будет подчеркнуто.И если вы щелкнете по нему, он останется подчеркнутым, пока вы не щелкнете в другом месте или не щелкнете по нему еще раз.Есть предложения?

Answer 1

Насколько я знаю, если вы говорите просто слова в <p>, тогда SOL без какого-либо серьезного навязчивого javascript.Если вы не возражаете против навязчивости, тогда вы можете войти, взять содержимое <p> и поместить каждый отдельный элемент в <span> или что-то в этом роде.Затем следует выделение JS.

Примечание: это jQuery

var timer;

$("span").mouseover(function() {
  timer = timeout(highlight(this), 2000);
});

$("span").mouseout(function() {
  clearTimeout(timer);
});

function underline(jObject) {
  jObject.css("text-decoration", "underline");
}

Это очень навязчиво, не красиво, и я не на 100%это сработает, но это должно дать вам представление о том, что вы ищете, по крайней мере.

Answer 2

Нет встроенного события, поэтому вам придется разделить текст и обернуть каждое слово в элемент. Это может стать очень медленным с большими объемами текста.

См. Как выделить каждое слово в jquery, чтобы дать определение каждому слову?

Посмотрите на этот образец - http://jsbin.com/ukuza5/3/edit Будет работать только с простым текстом - без HTML внутри p.