How to realize HTML imitating Command Line Interface
This article focuses on "how to achieve HTML imitating command line interface", interested friends may wish to take a look. The method introduced in this paper is simple, fast and practical. Let's let the editor take you to learn "how to implement HTML imitating command line interface".
HTML part
WeChatManager
$(document) .ready (function () {
$(document) .keyup (function (event) {
If (event.keyCode==13) {
$.ajax ({
Type: "POST"
Url: "ok.php"
Data: "code=" + $("# in") .val ()
Success:function (msg) {
$("ul") .append ("" + $("# in") .val () + "); / / output the input to the interface
$("ul") .append ("" + msg+ ""); / / get the return value and output
$("# in"). Val (""); / / clear the input box
$("# text") .scrollTop ($("# text") .scrollTop () + 32); / / pull the scroll bar to the bottom to display the input box
}
})
}
})
$("# in") [0] .focus ()
})
WechatDos
Welcome...
Login:
CSS part
@ charset "utf-8"
Body {
Background-color:#396DA5
Margin:0px
Padding:0px
Color:#fff
Font: Microsoft Yahei
Font-size:14px;}
.window {
Border:6px#cccoutset
Width:680px
Height:442px
Background-color:#000
Position:absolute
Top:40px
Left:68px
Overflow:hidden}
.title {
Background-color:#08246B
Padding:2px;}
# text {
Background-color:#000
Border-top:#cccoutset2px
Height:420px
Overflow-y:scroll;}
Ul {
Margin:0px
Padding:0px
List-style:none;}
Input {
Background-color:#000
Border:0
Color:#fff
Outline:none
/ * font-size:12px;*/
Width:100%}
At this point, I believe you have a deeper understanding of "how to achieve HTML imitating command line interface". You might as well do it in practice. Here is the website, more related content can enter the relevant channels to inquire, follow us, continue to learn!
