jQuery：觸發keydown只在特定div

我有一個DIV元素的幾個頁面。當用戶按下CTRL + ENTER組合鍵時，我需要顯示（通過alert（））該用戶以前選擇的文本。我發現solution，它的功能就像一個魅力，但還剩下一件事。jQuery：觸發keydown只在特定div

只有當選定文本位於類「main_content」的DIV中時，才需要進行事件觸發。我試圖將keyup分配給$（'DIV.main_content'），但它不起作用。

只有在$（'DIV.main_content'）內的文字被選中的情況下才有辦法讓事件觸發嗎？

下面是對整個文檔觸發工作代碼：

// Get user selection text on page 
function getSelectedText() { 
    if (window.getSelection) { 
     return window.getSelection(); 
    } 
    else if (document.selection) { 
     return document.selection.createRange().text; 
    } 
     return ''; 
} 

$(document).ready(function(){ 
    $(document).keydown(function(e) { 
     if(e.which == 13 && e.ctrlKey) { 
     alert(getSelectedText()); 
     return false; 
     } 
    }); 
});

See the code with markup in jsFiddle

來源

2011-01-07 Silver Light

你必須在getSelectedText()功能的錯誤：window.getSelection()返回Selection對象，而不是一個字符串。你將這個結果傳遞給alert()的事實掩蓋了這一點，因爲alert()隱含地將傳遞給它的參數轉換爲一個字符串。

下面是一些代碼，用於檢查選擇是否完全包含在具有特定類的<div>元素中。它適用於所有主流瀏覽器。

活生生的例子：http://www.jsfiddle.net/cVgsy/1/

// Get user selection text on page 
function getSelectedText() { 
    if (window.getSelection) { 
     return window.getSelection().toString(); 
    } 
    else if (document.selection) { 
     return document.selection.createRange().text; 
    } 
    return ''; 
} 

function isSelectionInDivClass(cssClass) { 
    var selContainerNode = null; 
    if (window.getSelection) { 
     var sel = window.getSelection(); 
     if (sel.rangeCount) { 
      selContainerNode = sel.getRangeAt(0).commonAncestorContainer; 
     } 
    } else if (document.selection && document.selection.type != "Control") { 
     selContainerNode = document.selection.createRange().parentElement(); 
    } 
    if (selContainerNode) { 
     var node = selContainerNode; 
     while (node) { 
      if (node.nodeType == 1 && node.nodeName == "DIV" && $(node).hasClass(cssClass)) { 
       return true; 
      } 
      node = node.parentNode; 
     } 
    } 
    return false; 
} 

$(document).ready(function(){ 
    $(document).keydown(function(e) { 
     if(e.which == 13 && e.ctrlKey && isSelectionInDivClass("main_content")) { 
      alert(getSelectedText()); 
      return false; 
     } 
    }); 
});

來源

2011-01-07 14:03:38

非常感謝你，我什至沒有想到這樣的事情 - 你會得到我的完全尊重。我也檢查了你的項目，rangy很棒！祝你工作順利！ :) – 2011-01-07 14:18:27

這是個有趣的問題。我有以下想法：您需要捕獲div上的mouseup事件。例如：

所以，你的情況，你可以做這樣的事情：

var selectedText = ""; 
$(".yourdiv").mouseup(function(){ 
if (window.getSelection) 
    selectedText = window.getSelection(); 

else if (document.selection) 
    selectedText = document.selection.createRange().text; 

    alert(selectedText) 

});

和可變selectedText將店內選定的文本。

來源

2011-01-07 14:08:28 Igor

有趣的想法，但它不會是正確的依靠鼠標操作在這裏。人們可以選擇文本而不用鼠標。 – 2011-01-07 14:10:31

jQuery：觸發keydown只在特定div

回答

相關問題