2014-12-12 11 views
5

contentEditable에서 불투명도를 변경하는 것이 선택된 것이 있습니다. html contentEditable document.execCommand 선택한 불투명도를 변경하십시오.

나는 다음과 같이 시도 :

document.execCommand('foreColor', false, 'rgba(0,0,0,0.5)'); // with rgba 
document.execCommand('foreColor', false, '80000000'); // with alpha hex 

으로도 문제가 해결되지 않습니다. 그러나 나는 쉽게 색을 바꿀 수 있습니다 :

document.execCommand('foreColor', false, '000000'); 

누구든지 document.execCommand를 사용하여 불투명도를 변경하는 데 도움을 줄 수 있습니까?

업데이트 추가에

은 발견 검색 중 :

document.execCommand '데 ForeColor는'주어진 색상 선택에 글꼴 태그를 추가합니다. 하지만 안타깝게도 HTML5에서는 color 속성이 지원되지 않습니다.

이 문제입니까? 그 대안은 무엇입니까?

답변

7

styleWithCSS 명령을 사용해야합니다.이 명령은 CSS 또는 HTML 형식을 execCommand 메서드로 문서에 생성해야하는지 여부를 지정합니다.

여기에서 사양을 참조하십시오 : https://dvcs.w3.org/hg/editing/raw-file/tip/editing.html#the-stylewithcss-command.

따라서이 경우 font 태그를 생성하는 대신 CSS 스타일을 사용하려면 true을 전달하십시오.

발췌문 : CSS와

function setColor() { 
 
    document.execCommand('styleWithCSS', false, true); 
 
    document.execCommand('foreColor', false, "rgba(0,0,0,0.5)"); 
 
}
<p contentEditable="true" onmouseup="setColor();">this is some text</p>

이 생성 HTML은 다음과 같이 적용 :

<p contenteditable="true" onmouseup="setColor();"> 
    this is <span style="color: rgba(0, 0, 0, 0.498039);">some</span> text 
</p> 

희망하는 데 도움이됩니다.

.

+0

감사합니다. 이 도움이 :-) – abduIntegral

+0

굉장, 고마워요 ... –