jquery得到選定的詞

Question

我有一個div與class ='divclass'和其中的一些文本...現在我想顯示一個彈出式菜單，當用戶鼠標懸停在div中的任何單詞...彈出窗口也會顯示該單詞？哪個用戶具有mousedover鼠標......我們如何才能做到這一點..

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>一個元素，那麼任何字：

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

Answer 3

試試這個：

$(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 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中的一個單獨的跨度中，然後綁定一個懸停事件。