Appending The Contents Of A UNIX Command To A Div Tag
I'm making a UNIX web-based terminal for learning purposes. So far I have made a text box and the output is being displayed. Sort of like this.
Solution 1:
change:
document.getElementById("txtOut").innerHTML=xmlhttp.responseText;
to:
document.getElementById("txtOut").innerHTML += xmlhttp.responseText;
On a sidenote, why are you not using any of the well established javascript frameworks?
With jQuery for example you could reduce your code to maybe 4 lines.
Edit - using jQuery: http://api.jquery.com/jQuery.ajax/
<html>
<head>
<link href="/css/webterminal.css" 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>
Post a Comment for "Appending The Contents Of A UNIX Command To A Div Tag"