如何從鼠標的段落中選擇和突出顯示單詞，即使在jquery或javascript中？

-1

我到處搜索這個問題，但我仍然無法得到一個很好的例子，我想選擇一個詞讓我說一個段落，並突出顯示它，當我點擊它，我知道你可以突出整個段落，但多數民衆贊成在什麼樣的即時通訊尋找，如果有人知道或有一個這樣做的想法，請讓我知道。如何從鼠標的段落中選擇和突出顯示單詞，即使在jquery或javascript中？

謝謝。

來源

2014-10-17 Walid

你試過雙擊這個詞嗎？這通常選擇它。 – 2014-10-17 15:24:56

我做了一個快速谷歌搜索（我想通人有可能已經涵蓋這一點），這的jsfiddle我略作修改從https://stackoverflow.com/a/20567136/1856947幾乎做了你需要的東西（不是說這是最好的方式）：

$('div').each(function() { 
    var $this = $(this); 
    $this.html($this.text().replace(/\b(\w+)\b/g, "<span>$1</span>")); 
}); 

$('div span').click(
    function() { 
     $(this).css('background-color','#ffff66'); 
    } 
);

http://jsfiddle.net/z7nkU/7/

來源

2014-10-17 15:42:55 robhuzzey

謝謝先生，這個例子看起來很完美，我修改了一下，使它正是我想要的。 – Walid 2014-10-18 22:33:23

您可以通過每一個字，圍繞着一個<跨度>進行預處理文本，並設置一個監聽器段落找到<跨度>目標，然後突出顯示元素，但是你想

來源

2014-10-17 15:24:50 chazsolo

您可以嘗試拆分句子轉換爲單詞並在span標籤中添加單詞。然後在點擊跨度標籤添加一個類亮點:)

var sentence = $('.sentence').html().split(/\s+/),  
 
    result = []; 
 

 
for(var i = 0; i < sentence.length; i++) { 
 
    result[i] = '<span>' + sentence[i] + '</span>'; 
 
} 
 

 
$('.sentence').html(result.join(' ')); 
 

 
$('.sentence').on('click', 'span', function(){ 
 
    $(this).addClass('highlight'); 
 
});

.sentence span:hover, .highlight{ 
 
    background: red; 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script> 
 

 
<p class="sentence">Lorem ipsum dolor sit amet, consectetur adipisicing elit. Similique aliquam totam odit excepturi reiciendis quam doloremque ab eius quos maxime est deleniti praesentium. Quia porro commodi blanditiis iure dicta voluptatibus.</p>

來源

2014-10-17 15:40:45

如何從鼠標的段落中選擇和突出顯示單詞，即使在jquery或javascript中？

回答

相關問題