Как взять введенную пользователем строку html и отобразить ее на странице

0

Я пытаюсь создать тестер HTML, который позволяет пользователю проверить, как будет отображаться его содержимое на странице позже. Все, что им нужно сделать, это ввести текст с форматированием html - им не нужно создавать всю веб-страницу. Здесь, где я нахожусь... Я упростил это, так что это просто основные вещи всей моей страницы:

<html>
<head>
    <style type="text/css">
    .mockup {
    position:absolute;
    left:1px;
    top:350px;
    width:530px;
    height:272px;
    z-index:250;
    overflow:hidden;
    background-color:#b2d0e3;
    font-family:"Times New Roman";
    font-size:16px;
    }
    </style>

    <SCRIPT language="VBScript">
    Sub sumChar
        'removed code
    End Sub

    Sub sendData() 
        Document.body.myDiv.InnerHTML = editableText.Value
    End Sub 
    </script>
</head>
<body>
    <p align="left"><font face="arial" size="2">Edit text here:</font></p>

    <textarea name="editableText" rows="11" cols="74" onchange="sumChar" onkeydown="sumChar" onkeyup="sumChar" onpaste="sumChar" oninput="vbscript:sumChar" tabIndex=4 language="VBscript"><b>Here</b> is some sample text with tags.<br />This needs to be rendered with formatting.</textarea>

    <p align="left"><input name="Button1" type="button" value="Send Data" style="height: 40px; width: 263px; font-size: larger" tabIndex=5 OnClick="vbscript:sendData" language="VBscript"></p>

    <div id="myDiv" class="mockup">
    </div>
</body>

Вы можете видеть, что я пытаюсь передать html, чтобы он отображался в div внизу страницы. Является ли это возможным? Он не работает, как есть, ясно, что я ошибаюсь. Кто-нибудь имеет какие-либо советы... и не стесняйтесь сказать мне, что я должен делать это в javascript (чтобы удалить ограничение Internet Explorer). Хотя, к сожалению, я даже начинаю с javascript. Спасибо всем, кто может помочь.

  • 2
    VBScript не должен использоваться для сценариев на стороне клиента . Только IE поддерживает это. Используйте JavaScript, чтобы сделать это.
Теги:
web
vbscript
hta

2 ответа

1
Лучший ответ

Вы также можете использовать jQuery для упрощения работы (библиотека javascript). Просто включите библиотеку jQuery в свой документ и добавьте следующий код в конец

<script>
    $('#textareaId').keyup(function(){
        $('#myDiv').empty().html($(this).val());
    });
</script>
  • 0
    Спасибо .. Мне нравится этот звук - похоже, keyup означает, что он срабатывает при каждом нажатии клавиши, поэтому div будет обновляться непрерывно? Это было бы здорово. Я изо всех сил пытаюсь заставить его работать ... Я загрузил jQuery и делаю ссылку на него в своем теге <script>. Я добавил идентификатор в свою текстовую область 'textareaId'. Я что-то упускаю из виду? Я буду продолжать пытаться
1

Хорай, понял, спасибо за ваш код, Боб. Сейчас я буду медленно разбираться в дополнительных битках. Здесь готовая страница в дистиллированной форме:

<html>
<head>
    <style type="text/css">
    .mockup {
    position:absolute;
    left:1px;
    top:250px;
    width:530px;
    height:272px;
    z-index:250;
    overflow:hidden;
    background-color:#b2d0e3;
    font-family:"Times New Roman";
    font-size:16px;
    }
    </style>
</head>

<body>
    <textarea id="textareaId" rows="11" cols="74"><b>Here</b> is some sample text with tags.<br />This needs to be rendered with formatting.</textarea>
    <div id="myDiv" class="mockup">
    </div>
</body>

<script src="jquery-1.10.2.min.js"></script>
<script type="text/javascript">
    $('#textareaId').keyup(function(){
        $('#myDiv').empty().html($(this).val());
    });
</script>

</html>

Ещё вопросы

Сообщество Overcoder
Наверх
Меню