웹 양식에 ContentEditable을 사용하는 것이 좋습니다?

Question

페이지에서 텍스트를 바로 편집하고 각 필드의 커서가 바뀌면 변경 사항을 커밋하는 양식 유형의 편집기를 만들고 싶습니다. 글꼴이나 스타일이 변경되지 않고 직선 상자 만 사용됩니다.

몇 가지를 보았습니다. JEditable하지만 '확인'을 눌러야하는 상자와 필요성은 약간 매력적이지 않고 직관적이지 않은 것처럼 보입니다.

각 요소에 contentEditable="true"을 적용하는 것에 대해 궁금합니다. 같은 것을 달성 할 것이라고 상상합니다. 입력이있는 양식이 아니기 때문에, 자바 스크립트를 통해 변경 사항을 제출해야하지만, 그것은 상상할 수 있습니다.하지만 그것은 내 상황에 적용 할 수 있습니다. (또한 JEditable 또는 이와 유사한 것과 같은 모든 요소에 대해 자바 스크립트에 대해 걱정하는 것보다 다소 단순 해 보입니다.

합리적인 해결책입니까? 사이트의 특정 부분에 대한 모바일 브라우저 지원에 대해 걱정하지 않습니다. 그러나 또는 무언가를을 지원합니다 ...)

Answer 1

코드 현명한 이런 식으로 뭔가 볼 필요가있다 :.이 jQuery를 구문 BTW

$(".YourElementClassHere").click(function() { 
    $("#YourTextArea").position($(this).position()); 
    $("#YourTextArea").css("display", "block"); 
}); 

$("#YourTextArea").click(function() { 
    if (event.which == 13) { 
    $("#YourTextArea").css("display", "none"); 
    // Do something to commit this: $("#YourTextArea").text(); 
    } 
}); 

입니다 알고 안 사람을 위해 이 . 나는 이것이 약간 녹슬어 졌기 때문에이 도움이되기를 바란다.이 자바 스크립트는 약간의 변경이 필요할 수있다.