2012-01-12 54 views
1

是否有可能拋出一個div元素內的文本的jquery-select()事件? 這是我的例子,但它不工作。獲取突出顯示的文本 - 並導航到URL

<div id='id1'>Hello text</div> 
$("#id1").select(function() { 
    alert("something was selected"); 
}); 

我的目標是在文本中選擇一個詞,並把這個選擇的單詞在URL,並與這個網址打開一個新窗口。 例如我標記或者更確切地說,我選擇的話打招呼,單詞Hello應該在這個網址

window.open('http://dict.leo.org/ende?lp=ende&lang=de&searchLoc=0&cmpType=relaxed&sectHdr=on&spellToler=&search=Hello'); 

我不知道apear如果選擇事件纔是正道。 請幫忙。 抱歉我的英文不好!

+0

檢查此問題:http://stackoverflow.com/questions/985272/jquery-selecting-text-in-an-element-akin-to-highlighting-with-your-mouse – Gabe 2012-01-12 22:02:51

回答

3

翻譯的選定的(高亮顯示)的文本部分

jsBin demo

function getSelRange() { 
    var notIE8 = window.getSelection; 
    var rng = notIE8 ? window.getSelection() : document.selection.createRange().htmlText; 
    return $.trim(rng); 
} 

$('#id1').mouseup(function() { 
    var selRange = getSelRange(); // THE HIGHLIGHTED TEXT PORTION 
    if(selRange) window.open('https://translate.google.com/#en/de/'+ selRange); // TRANSLATE 
}); 
<div id='id1'> 
    Please highlight a text range you want to translate. 
    Translating text is really cool. You should try it! 
</div> 

NBnotIE8意味着大於或等於IE8更低;)

P.S:如果您不使用jQuery,並且您需要支持較舊的瀏覽器,請確保使用onclick函數和a Polyfill for .trim();
像往常一樣使用JS的addEventListener()String.prototype.trim()

2

不,jQuery.select()僅限於文本輸入字段和textareas。

JavaScript有一些不同的選擇:

if (window.getSelection) { 
    txt = window.getSelection(); 
} else if (document.getSelection) { 
    txt = document.getSelection(); 
} else if (document.selection) { 
    txt = document.selection.createRange().text; 
} else return; 
alert(txt); 

但你必須要綁定的是某種監聽事件。大多數應用程序使用右鍵菜單或其他東西。

+0

非常感謝你。 – Pero 2012-01-12 22:29:05