powrócić do contenteditable po execCommand?

Mam następujący kod demonstrujący właściwość contenteditable i przycisk, który wprowadzi pogrubiony tekst w akapicie z contenteditable area. Moje pytanie brzmi: jak przywrócić ostrość do miejsca, w którym przerwałam po kliknięciu pogrubionym, jeśli podświetlisz jakiś tekst i klikniesz pogrubioną czcionką, pogrubi ona tekst, ale fokus już tam nie będzie. To samo dzieje się, jeśli nic nie zaznaczysz i klikniesz pogrubioną czcionką, fokus zniknie, a jeśli klikniesz ponownie w miejscu, w którym zostało przerwane, możesz wpisać pogrubione teksty.powrócić do contenteditable po execCommand?

Dziękuję bardzo za pomoc!

<head> 
    <style type="text/css"> 
    #container{ 
     width:500; 
    } 
    .handle{ 
     float:left; 
    } 
    </style> 
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script> 
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.7.2/jquery-ui.min.js"></script> 
    <script type="text/javascript"> 
    $(function(){ 
     $('#bold').click(function(){ 
      document.execCommand('bold', false, true); 
     }); 
    }); 
    </script> 
</head> 
<button id="bold">Bold</button> 
<div id="container"> 
<div class="c"><p contenteditable>Some text here asdf asdf asdf asdf asdf asd fasd fsa dfsa df asdf sadf sa dfa sdf sadf asd fsa df sadf asdf asdf asd fas df asdf as </p></div> 

<div class="c"><p contenteditable>Some text here asdf asdf asdf asdf asdf asd fasd fsa dfsa df asdf sadf sa dfa sdf sadf asd fsa df sadf asdf asdf asd fas df asdf as </p></div> 
</div>

Źródło

2009-08-22 FurtiveFelon

Możesz przechowywać ostatni element klikniętego w zmiennej, a następnie zadzwonić .focus() na nim po .execCommand został wykonany. Coś takiego, myślę:

$(function(){ 
     $('p.editable').click(function() { 
      var clickedItem = $(this); 
      clickedItem.attr('contenteditable', true).focus(); 
      $('#bold').click(function(){ 
        document.execCommand('bold', false, true); 
        clickedItem.focus(); 
      }); 
     }); 
    });

W ten sposób można również usunąć atrybut z znacznikach "contenteditable" ...

HTH

Źródło

2009-09-11 11:55:14 ALFABreezE

Spowoduje to powiązanie akcji ze zdarzeniem kliknięcia "# bold" za każdym razem, gdy klikniesz akapit, co spowoduje, że program obsługi zostanie powiązany kilka razy. Nie chcesz tego. – Jake

Dodana klasa ".editable", więc wiąże się tylko z paragrafem z tą klasą określoną w znacznikach. – ALFABreezE

Za każdym razem, gdy klikniesz na p.editable, handler będzie związany #bold. Po kliknięciu #bold wszystkie te zostaną uruchomione, co spowoduje, że execCommand będzie uruchamiany wiele razy, a fokus skacze wokół wszystkich kliknięć, które zostały kliknięte. Odpowiedź devongovett dana nie cierpi z powodu tego problemu, ponieważ obsługa #bold jest powiązana tylko raz. – Jake

HTML:

<button onclick="doRichEditCommand('bold')" style="font-weight:bold;">B</button>

JavaScript:

function doRichEditCommand(aName, aArg){ 
    getIFrameDocument('editorWindow').execCommand(aName,false, aArg); 
    document.getElementById('editorWindow').contentWindow.focus() 
}

Patrz to może pomóc:

https://developer.mozilla.org/en/Rich-Text_Editing_in_Mozilla

Źródło

2009-09-16 14:55:00

można po prostu użyć .focus jQuery function(), aby go ustawić ostrość. To powinno działać:

var current; 
$(function(){ 
    $("p[contenteditable]").focus(function() { 
     current = this; 
    }); 

    $('#bold').click(function(){ 
      document.execCommand('bold', false, true); 
      $(current).focus(); 
    }); 
});

To właśnie śledzi dziedzinie aktualnie edytowanego za każdym razem jest skupiane przez użytkownika, a po naciśnięciu przycisku bold kliknięciu ostrość jest ustawiona z powrotem do tego pola.

Źródło

2009-11-27 00:37:28 devongovett

NALEŻY UŻYWAĆ .contents()

var current; 
$(function(){ 
    $("p[contenteditable]").focus(function() { 
     current = this; 
    }); 

    $('#bold').click(function(){ 
      document.execCommand('bold', false, true); 
      $(current).contents().focus(); 
    }); 
});

Źródło

2010-07-22 02:56:35 fukid

dzięki, to pomaga! –

dlaczego wywołać .contents()? – xec

Nie wiem, dlaczego '.contents()' jest wymagany, ale działa, podczas gdy bezpośrednie wywoływanie '.focus()' nie działa. Fukid, czy możesz wyjaśnić? – FeifanZ

Jeśli jesteś w iframe, zadzwoń ostrość() na widoku domyślnym.

myiframedocument.execCommand('Bold',false,null); 
myiframedocument.defaultView.focus();

Źródło

2012-01-18 00:29:08

powrócić do contenteditable po execCommand?

Odpowiedz

Powiązane problemy