편집 상자 : 사용자 서식을 사용하지 않도록 설정했지만 내 양식을 추가하십시오.

Question

HTML의 서식있는 텍스트 상자는 약간의 지뢰밭이지만이 특수한 상황이 너무 까다로울 수는 없기를 바랍니다. 사용자가 서식을 지정할 수없는 텍스트 상자가 필요하지만 스크립팅을 통해 일부 서식 지정을 추가 할 수 있습니다 (텍스트 영역이 작동하지 않음).

첫 번째 생각은 contentEditable을 사용할 수 있었고 사용자가 툴바가 없다면 많은 작업을 수행 할 수 없지만 여전히 Ctrl + B, Ctrl + I 등의 조합이 있다는 것입니다. Ctrl 키를 누르면

ctrlHandler = function (event) { 
    event.preventDefault(); 
}; 

this.keydown(function (event) { 
    if (event.ctrlKey) { 
     $(this).bind('keypress', ctrlHandler); 
    } 
}); 
this.keyup(function (event) { 
    if (event.ctrlKey) { 
     $(this).unbind('keypress', ctrlHandler); 
    } 
}); 

가 그래서 ( keydown) 이벤트 핸들러가 기본을 방지하고 출시 때 이벤트 처리기가 언 바운드의 키에 바인딩 : 그래서 이런 짓을. 영리 하네, 응? (나는 잘라 내기/복사/붙여 넣기 등의 조합을 나중에 처리하는 방법을 알아 냈습니다.) 이것으로 이벤트 처리기가 올바르게 바인딩되지만 event.preventDefault()은 실제로 기본값을 방지하지 않습니다! 텍스트는 마치 내가 마치지 않은 것처럼 굵게/기울임 꼴로/밑줄이 그어집니다. 형식 변경은 이벤트가 시작되기 전에 발생하는 것으로 보입니다. keypress 대신 keydown 또는 keyup을 사용하면 작동하지 않습니다. 누구든지 다른 (크로스 브라우저) 접근법이나이 방법을 만드는 방법을 생각할 수 있습니까?

Answer 1

아하! event.ctrlKey은 내가 오해 한 것 같습니다. Ctrl + B를 누르면 두 개의 keydown 이벤트가 발생하지 않고 event.ctrlKey가 true로 설정된 이벤트가 발생합니다. 그래서 if (event.ctrlKey) event.preventDefault() 트릭을 할 것입니다. 모든 브라우저에서 아직 테스트되지 않았습니다.