jquery는 선택된 단어를 가져옵니다.

Question

div = 클래스 'divclass'안에 일부 텍스트가 있습니다 ... 이제는 사용자가 mouseover 할 때 팝업을 표시하려고합니다 ... 팝업에는 단어도 표시됩니다 ?

$('.divclass span').mouseover(function(){ 
    alert($(this).text()); 
    // or showMyPopup($(this).text()); 
}); 

Answer 1

나는 bicccio에 동의합니다.

$(function() { 
    var text = $(".divclass").text(); 
    text = "<span>" + $.trim(text) + "</span>"; 
    text = text.replace(/\s/g, "</span><span>&nbsp;") 
    $(".divclass").html(text); 

    $(".divclass span").live("mouseover", function() { 
     alert($(this).text()); 
    }); 
}); 

Answer 2

난 당신이 다음 <span> 같은 요소와 어떤 단어를 둘러싸고한다고 생각

$(document).ready(function(){ 
var all_words=$("#divclass").text().split(' '); 
$("#divclass").html(""); 

$.each(all_words, function(i,val) 
{ 
$('<span/>').text(val +" ").appendTo("#divclass"); 

}); 
$("#divclass span").live("mouseover",function(){ 
    alert($(this).text()); 
}); 

}); 

이곳에보기 : http://jsfiddle.net/jqLw8/

Answer 3

이 시도 :있는 사용자가 마우스를 mousedover있다 ... 우리가 이것을 달성 할 수있는 방법 ..

Answer 4

당신은이 작업을 수행 할 수 있습니다 : 텍스트를 표시하기 위해 당신은 또한 다음 코드로 각 단어 주위 스팬의 생성을 자동화 할 수있는 시간을 저장 한 다음 이벤트를 연결하려면 우리가 '무엇

function divideTextInSpans(text){ 
    return $.map(text.split(" "), function(word){ 
     return '<span class="word">'+word+'</span>'; 
    }).join(' '); 
} 

$(document).ready(function(){ 
    $(".divclass").each(function(){ 
     var newInnerHtml = divideTextInSpans($(this).text()); 
     $(this).html(newInnerHtml); 
     $(this).find(".word").hover(function(){ 
      //Show your popup code here 
      $(this).css("backgroundColor", "yellow"); //Highlight 
     }, function(){ 
     //Hide your popup code here 
      $(this).css("backgroundColor", ""); //Un-Highlight 
     }); 
    }); 
}); 

다시 한 번 div의 각 단어를 별도의 범위에두고 hover 이벤트를 바인딩합니다.