JSでコンソールベースのアプリケーションを作成することはできますか？
この種のものはすべて私が今達成することができます。私は、ブラウザ内のコンソールベースのアプリケーションではなく、ポップアッププロンプトを期待していた ：P私は、上記構成しているJavascriptのプログラムの中でJavascriptコンソールアプリケーション？
var fname=prompt("Command:","")
if (fname=="do_stuff") {alert("Ok, i will do stuff...")}
else {alert("You did not tell me something i know!")};
：promptボックスが が最初ありますがにif文ですユーザーが "do_stuff"を入力していない場合は、それを確認してください。（ "else"）、アラートボックスが表示されます。
短い答えを使用することです：あなただけはJavaScriptを使用して何でもについてを行うことができます。ここでは、多くのウィンドウコマンドラインアクションと同様に、コマンドの後ろにスペース区切りの引数セットが続くコンソールの例を示します。
あなたはJavaScriptの新機能のようですが、ブラウザのコアでどのように動作するのかを学ぶべきですが、どのブラウザを使用するのか分かりません。 YUIフレームワークを使用しているので、私のコードはブラウザの正規化に邪魔されません。
以下をHTML文書として保存してください。その後、ブラウザで開いたら、 "do_stuff arg1 George 9 howdy"または "Greet Navweb"を試してみてください。私はあなたがコードを調べることによって何が起こっているのか理解できることを願っています。
<!doctype html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<meta http-equiv="X-UA-Compatible" content="IE=Edge"/>
<title>Console</title>
<link rel="stylesheet" type="text/css" href="http://yui.yahooapis.com/combo?3.5.0/build/cssreset/cssreset-min.css"/>
<style type="text/css">
html {
background-color: #000;
}
body {
font-family: "Lucida Console";
font-size: 13px;
color: #0f0;
}
#in {
display: block;
position: fixed;
left: 0;
bottom: 0;
width: 100%;
padding: 8px;
border-color: #fff;
border-width: 1px 0 0 0;
background-color: #000;
color: #0f0;
}
</style>
</head>
<body>
<div id="out"></div>
<input id="in" tabindex="0"/>
</body>
<script type="text/javascript" src="http://yui.yahooapis.com/combo?3.5.0/build/yui/yui-min.js"></script>
<script type="text/javascript">
YUI().use("node", function(Y) {
var COMMANDS = [
{
name: "do_stuff",
handler: doStuff
},
{
name: "greet",
handler: function(args) {
outputToConsole("Hello " + args[0] + ", welcome to Console.");
}
}
];
function processCommand() {
var inField = Y.one("#in");
var input = inField.get("value");
var parts = input.replace(/\s+/g, " ").split(" ");
var command = parts[0];
var args = parts.length > 1 ? parts.slice(1, parts.length) : [];
inField.set("value", "");
for (var i = 0; i < COMMANDS.length; i++) {
if (command === COMMANDS[i].name) {
COMMANDS[i].handler(args);
return;
}
}
outputToConsole("Unsupported Command: " + command);
}
function doStuff(args) {
outputToConsole("I'll just echo the args: " + args);
}
function outputToConsole(text) {
var p = Y.Node.create("<p>" + text + "</p>");
Y.one("#out").append(p);
p.scrollIntoView();
}
Y.on("domready", function(e) {
Y.one("body").setStyle("paddingBottom", Y.one("#in").get("offsetHeight"));
Y.one("#in").on("keydown", function(e) {
if (e.charCode === 13) {
processCommand();
}
});
});
});
</script>
</html>
最も簡単な、最も互換性のある方法は、このようなtermlibなど、多くのJavascriptの端末エミュレータライブラリの1、jqueryterminalなど
私はあなたがここでいくつかのCSSを使用しているのを見て、それは本当にnecceseryですか？私は恐れています。 – Navweb
私はちょうどDOSのように見える/感じる/機能のようなコンソールをあなたに与えるだろうと思った。私はCSSを完全に削除しても機能すると信じています。 – Brendan
私はあなたのコマンドが大文字小文字を区別していることに気がついたので、大文字小文字を区別しないようにする方法はありますか？例えば、 - 私が入力したもの： 'do_stuff';私も入力することができます： 'dO_StUfF' – Navweb