Блог

Главная - Вопросы по программированию - Необходимо изменить шрифт выбранного слова в текстовой области

Необходимо изменить шрифт выбранного слова в текстовой области

#javascript #php #jquery #html

#javascript #php #jquery #HTML

Вопрос:

В этом я получаю всю кнопку, чтобы изменить шрифт word, но я получаю текстовую область, но я не могу изменить шрифт моей информации, или когда я нажимаю курсив, выбранное слово должно измениться курсивом.

 <html>
    <head>
    </head>
    <body onLoad="def()">
        <center>
            <div style="width:500px; text-align:left; margin-bottom:10px ">
                <input type="button" id="bold" style="height:21px; width:21px; font- weight:bold;" value="B" onClick="fontEdit('bold')" />
                <input type="button" id="italic" style="height:21px; width:21px; font- style:italic;" value="I" onClick="fontEdit('italic')" />
                <input type="button" id="underline" style="height:21px; width:21px; text-decoration:underline;" value="U" onClick="fontEdit('underline')" /> |
                <input type="button" style="height:21px; width:21px;" value="L" onClick="fontEdit('justifyleft')" title="align left" />
                <input type="button" style="height:21px; width:21px;" value="C" onClick="fontEdit('justifycenter')" title="center" />
                <input type="button" style="height:21px; width:21px;" value="R" onClick="fontEdit('justifyright')" title="align right" /> |
                <select id="fonts" onChange="fontEdit('fontname',this[this.selectedIndex].value)">
                    <option value="Arial">Arial</option>
                    <option value="Comic Sans MS">Comic Sans MS</option>
                    <option value="Courier New">Courier New</option>
                    <option value="Monotype Corsiva">Monotype</option>
                    <option value="Tahoma">Tahoma</option>
                    <option value="Times">Times</option>
                </select>
                <select id="size" onChange="fontEdit('fontsize',this[this.selectedIndex].value)">
                    <option value="1">1</option>
                    <option value="2">2</option>
                    <option value="3">3</option>
                    <option value="4">4</option>
                    <option value="5">5</option>
                </select>
                <select id="color" onChange="fontEdit('ForeColor',this[this.selectedIndex].value)">
                    <option value="black">black</option>
                    <option style="color:red;" value="red">red</option>
                    <option style="color:blue;" value="blue">blue</option>
                    <option style="color:green;" value="green">green</option>
                    <option style="color:pink;" value="pink">pink</option>
                </select> |
                <input type="button" style="height:21px; width:21px;" value="1" onClick="fontEdit('insertorderedlist')" title="Numbered List" />
                <input type="button" style="height:21px; width:21px;" value="●" onClick="fontEdit('insertunorderedlist')" title="Bullets List" />
                <input type="button" style="height:21px; width:21px;" value="←" onClick="fontEdit('outdent')" title="Outdent" />
                <input type="button" style="height:21px; width:21px;" value="→" onClick="fontEdit('indent')" title="Indent" />
            </div>
            <textarea id="textEditor" style="width:500px; height:170px;">aaaaaaaaa
            </textarea >
        </center>
        <script type="text/javascript">
            <!--
            textEditor.document.designMode = "on";
            textEditor.document.open();
            textEditor.document.write('<head><style type="text/css">body{ font-    family:arial; font-size:13px; }</style> </head>');
            textEditor.document.close();

            function def() {
                document.getElementById("fonts").selectedIndex = 0;
                document.getElementById("size").selectedIndex = 1;
                document.getElementById("color").selectedIndex = 0;
            }

            function fontEdit(x, y) {
                textEditor.document.execCommand(x, "", y);
                textEditor.focus();
            }
            -->
        </script>
    </body>
</html>

Комментарии:

1. измените свой iframe на input type=textarea

2. хорошо, позвольте мне проверить ..?

3. @RST нет, я не могу изменить свое слово в другом формате?

4. при включении текстовой области я могу получить текстовое поле, и там я могу написать любое предложение, но во время написания я хочу изменить некоторые слова жирным шрифтом, некоторые подчеркнуты, как я могу это сделать.

5. Ваш вопрос был о том, что текстовая область не отображается. Это та часть, на которую я ответил / решил. Заставить ваш скрипт работать — это новый вопрос.