使用 javascript 的网页上类似控制台的界面
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/3090108/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
console-like interface on a web page using javascript
提问by Daniel
I very like MySQLs mysql cli tool and I don't like phpMyAdmin. [IMHO]It's a nice thing for a Windows user, but its not so good when you've used to console.[/IMHO].
我非常喜欢 MySQL 的 mysql cli 工具，但我不喜欢 phpMyAdmin。[恕我直言]这对 Windows 用户来说是件好事，但当你习惯了控制台时它就不那么好了。[/恕我直言]。
What I want is to build a web page containing element with console-like input (for example something like this) which should get input from user, send it to PHP script on back-end and show back-end response.
我想要的是构建一个包含类似控制台输入的元素（例如像这样的东西）的网页，它应该从用户那里获取输入，将其发送到后端的 PHP 脚本并显示后端响应。
Back-end script is done (it was the easiest part), but I can't find any library for JavaScript implementing console-like input.
后端脚本已完成（这是最简单的部分），但我找不到任何用于实现类似控制台输入的 JavaScript 库。
I've tried to examine and modify for my needs example I've provided, but it's too bloated (because doesn't use any libraries) and implements specific thing. Also I would like this element to provide some auto-completion for input.
我已经尝试检查和修改我提供的需求示例，但它太臃肿（因为不使用任何库）并且实现了特定的东西。此外，我希望此元素为输入提供一些自动完成功能。
Any ideas on such JS library?
关于这样的 JS 库的任何想法？
回答by user2282623
I think you are looking for this: jQueryTerminal
我想你正在寻找这个：jQueryTerminal
回答by jcubic
there is shellinabox- javascript terminal.
有shellinabox- javascript 终端。
EDIT:
编辑：
There is also library xterm.jsthat's real terminal emulator.
还有一个真正的终端模拟器库xterm.js。
EDIT 2:
编辑 2：
My jQuery Terminal library is useful when you need custom behavior and you can write your code in JS or as backend code, but backend need to be simple input -> output, if you want to run for instance interactive backend commands, like vi or emacs, you need proper tty, for this use xterm.js (or implement that in JavaScript) for any other usage jQuery Terminal is better. It have lot of features and you don't need to run process on the server (listen on a port) which usually is forbidden on shared hostings or GitHub pages.
我的 jQuery 终端库在您需要自定义行为时很有用，您可以在 JS 中编写代码或作为后端代码，但后端需要是简单的输入 -> 输出，如果您想运行例如交互式后端命令，如 vi 或 emacs ，您需要适当的 tty，为此使用 xterm.js（或在 JavaScript 中实现它）对于任何其他用法 jQuery Terminal 更好。它有很多功能，您不需要在服务器上运行进程（在端口上侦听），这通常在共享主机或 GitHub 页面上是被禁止的。
回答by Joey
instead of using console.log()use document.write()
而不是使用console.log()使用document.write()
It will write text on the webpage just like console.logwould in the console
它将像console.log在控制台中一样在网页上写入文本
回答by 1j01
I've made a console library called Simple Console(I'll probably rename it because simple-consoleis taken on npm)
我制作了一个名为Simple Console的控制台库（我可能会重命名它，因为它simple-console是在npm上使用的）
It handles command history and such for you, and you can use it to implement any kind of console.
它为您处理命令历史记录等，您可以使用它来实现任何类型的控制台。
var handleCommand = (command)=> {
var req = new XMLHttpRequest();
req.addEventListener("load", ()=> {
con.log(req.responseText);
// TODO: use con.error for errors and con.warn for warnings
// TODO: maybe log a table element to display rows of data
});
// TODO: actually pass the command to the server
req.open("GET", "mysql.php");
req.send();
};
var con = new SimpleConsole({
handleCommand,
placeholder: "Enter MySQL queries",
storageID: "mysql-console"
});
document.body.appendChild(con.element);
Check out the documentation on GitHubfor more information.
