2013-08-26 15 views
9

Więc mam contenteditable div w mojej aplikacji Rails, i muszę być w stanie wyświetlić małe okienko nad tekstem, kiedy jest podświetlone. Obecnie mam kod, który działa, i wyświetla podświetlony tekst w alarmie. Jednak funkcja wykonywana jest przy pomocy myszki, więc po kliknięciu w div, aby rozpocząć pisanie lub wyróżnianie, wyświetla on pusty alert.Pobierz wybrany tekst w treściDodatkowe?

Oto mój kod:

function getSelected() { 
      if (window.getSelection) { 
       return window.getSelection(); 
      } 
      else if (document.getSelection) { 
       return document.getSelection(); 
      } 
      else { 
       var selection = document.selection && document.selection.createRange(); 
       if (selection.text) { 
        return selection.text; 
       } 
       return false; 
      } 
      return false; 
     }; 
$("#content-create-partial").bind("mouseup", function(){ 
       var text = getSelected(); 
       if(text) { 
        console.log(text); 
       } 
       else{ 
        console.log("Nothing selected?"); 
       }; 
      }); 

Jak zapobiec jQuery od wykonywania funkcji, gdy użytkownik kliknie na contenteditable div? Chcę tylko, aby był on wykonywany, gdy podświetlony jest aktualny tekst.

Odpowiedz

-2

Wystarczy sprawdzić, czy wybór jest pusty: if ($.trim(text) != '') ...

0

Jest „selectstart” wydarzenie, które odpala gdy użytkownik uruchamia wybór. Nie ma żadnego zdarzenia końcowego wyboru, ale można wykryć zdarzenie mouseup po uruchomieniu zdarzenia "selectstart", aby upewnić się, że nastąpiło wybieranie.

Edit:

Sprawdź - HTML Content Editable div: select text event

2

Możesz porównać window.getSelection().anchorOffset i window.getSelection().extentOffset aby sprawdzić, czy są one równe. Jeśli tak, to było to normalne kliknięcie.

1

Poniższy kod zwróci wartość true, jeśli nic nie zostanie wybrane.

Zainspirowany z @Tarun Dugar. Ale nie działa we wszystkich przeglądarkach. Następujące pracował.

window.getSelection().focusOffset == window.getSelection().anchorOffset;