body { font-family: monospace; margin: 20px; background-color: #f0f0f0; } #myterm { height: 300px; /* 终端高度 */ width: 80%; /* 终端宽度 */ max-width: 800px; /* 最大宽度 */ margin: 0 auto; /* 居中显示 */ border: 1px solid #333; /* 边框 */ box-shadow: 0 0 10px rgba(0, 0, 0, 0.5); /* 阴影效果 */ background-color: #000; /* 终端背景色 */ color: #0f0; /* 默认文字颜色 (绿色) */ padding: 10px; box-sizing: border-box; /* 包含内边距和边框在宽度内 */ }

在指定 Div 中创建 jQuery Terminal

这是一个演示如何在自定义 div 元素中初始化 jquery.terminal 的示例。

$(document).ready(function() { $(‘#myterm’).terminal({ hello: function (name) { this.echo(‘Hello, ‘ + name + ‘. Welcome to MyTerm’); }, // 示例：一个简单的加法命令 add: function(a, b) { a = parseInt(a); b = parseInt(b); if (isNaN(a) || isNaN(b)) { this.echo(‘Usage: add ‘); } else { this.echo(‘Result: ‘ + (a + b)); } } }, { greetings: ‘欢迎来到 MyTerm! 输入 “help” 查看可用命令。’, name: ‘myterm_demo’, prompt: ‘myterm> ‘ }); });