Добавление содержимого команды UNIX в тег div - PullRequest
Новая
       2

Добавление содержимого команды UNIX в тег div

0 голосов
/ 12 апреля 2011

Я делаю веб-терминал UNIX для обучения.До сих пор я сделал текстовое поле, и вывод отображается.Вроде как. 

<code><?php
$output = shell_exec('ls');
echo "<pre>$output
";?>

image

Form




 function shell_execute (str) {if (str.length == 0) {document.getElementById (" txtOut ") .innerHTML = ""; return;} if (window.XMLHttpRequest) {// код для IE7 +, Firefox, Chrome, Opera, Safari xmlhttp = new XMLHttpRequest ();} else {// код для IE6, IE5 xmlhttp = newActiveXObject ("Microsoft.XMLHTTP");} xmlhttp.onreadystatechange = function () {if (xmlhttp.readyState == 4 && xmlhttp.status == 200) {document.getElementById ("txtOut"). InnerHTML = xmlhttxt.se}} xmlhttp.open ("GET", "exec.php? q =" + str, true); xmlhttp.send ();}  Веб-терминал UNIX 1.0  выход   <</form>

Но я хочу, чтобы эта страница выглядела как терминал.Когда я набираю команду, она должна сохранить результат команды оболочки, а затем добавить его в тег div.Так как я набираю команды, он будет показывать вывод.Как в терминале UNIX.

Как добавить вывод команд в тег div?

1 Ответ

2 голосов
/ 12 апреля 2011

изменение: 

document.getElementById("txtOut").innerHTML=xmlhttp.responseText;

до: 

document.getElementById("txtOut").innerHTML += xmlhttp.responseText;

Почему вы не используете ни одну из хорошо зарекомендовавших себя фреймворков javascript?

Например, с помощью jQuery вы можете сократить код до 4 строк.

Редактировать - используя jQuery: http://api.jquery.com/jQuery.ajax/

<html>
    <head>
        <link href="/css/webterminal.css" rel="stylesheet" type="text/css" />
        <script type="text/javascript" src="http://code.jquery.com/jquery-1.5.2.min.js"></script>
        <script type="text/javascript">
            $(function () {
                $('#cmd').bind('keydown', function (evt) {
                    if (evt.keyCode === 13) { // enter key
                        var cmdStr = $(this).val();

                        $.ajax({
                            url: 'exec.php',
                            dataType: 'text',
                            data: {
                                q: cmdStr
                            },
                            success: function (response) {
                                $('#txtOut').append(response);
                            }
                        });
                    }
                });
            });
        </script>
    </head>

    <body>
        <div class="container">
            <h2>UNIX Web Based Terminal 1.0</h2>
            <br />
            <p><b>output</b></p>

            <span id="User"></span>
            <input id="cmd" type="text" class="textbox" size="20" />

            <div class="output">
                <p><span id="txtOut"></span></p>
            </div>
        </div>
    </body>
</html>
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.

Нет похожих вопросов

...