[程序员] 人手一个工具站：文字竖排(开源单 html 文件)

小天管理 · 6月15日

天|本|化|范|码|首|
找|来|，|，|比|先|
不|打|并|我|较|说|
到|算|适|只|乱|明|
了|贴|配|做|，|，|
，|原|了|了|且|原|
只|作|下|相|不|作|
好|者|移|应|遵|者|
放|链|动|界|守|不|
弃|接|设|面|ｈ|是|
～|的|备|上|ｔ|我|
　|，|。|的|ｍ|，|
　|找|　|修|ｌ|原|
　|了|　|改|５|先|
　|半|　|优|规|代|

以下代码保存成单 .html 文件即可

<!DOCTYPE html>
<html lang="zh-CN">

<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>竖排文字转换器古典中文排版工具</title>
<style>
body {
font-family: Arial, sans-serif;
/* 设置默认字体 */
line-height: 1.6;
/* 设置默认行高 */
margin: 0;
padding: 0;
}

.container {
max-width: 800px;
/* 设置页面最大宽度 */
margin: 0 auto;
/* 居中显示 */
padding: 20px;
}

.textarea-container {
width: 100%;
margin-bottom: 10px;
}

textarea {
width: 100%;
min-height: 150px;
padding: 10px;
background-color: #F5F5F5;
font-size: 14px;
line-height: 1.4;
border: 1px solid #ccc;
box-sizing: border-box;
/* 让 padding 不会增加元素宽度 */
resize: vertical;
/* 垂直方向可拖动调整大小 */
}

.input-group {
margin-bottom: 10px;
}

.input-group label {
margin-right: 10px;
}

@media (max-width: 600px) {
.container {
padding: 10px;
}

textarea {
min-height: 100px;
}
}
</style>
<script>

var S = "\n\n\n ";
var str = "";

var strGB = "皑蔼碍爱肮袄奥坝罢摆败颁办绊帮绑镑谤剥饱宝报鲍辈贝钡狈备惫绷笔毕毙币痹闭边编贬变辩辫标鳖别瘪濒滨宾摈饼并拨钵铂驳补财采参蚕残惭惨灿苍舱仓沧厕侧册测层诧搀掺蝉馋谗缠铲产阐颤场尝长偿肠厂畅钞车彻尘陈衬撑称惩诚骋迟驰耻齿炽冲宠畴踌筹绸橱厨锄雏础储触处传疮闯创锤纯绰辞词赐聪葱囱从丛凑蹿窜错达带贷担单郸掸胆惮诞弹当挡党荡档捣岛祷导盗灯邓敌涤递缔颠点垫电淀钓调谍叠钉顶锭订丢东动栋冻犊独读赌镀锻断缎兑队对吨顿钝夺堕鹅额讹恶饿儿尔饵贰发罚阀珐矾钒烦贩饭访纺飞诽废费纷坟奋愤粪丰枫锋风疯冯缝讽凤肤辐抚辅赋复负讣妇缚该钙盖赶秆赣冈刚钢纲岗镐搁鸽阁铬个给龚宫巩贡钩沟构购够蛊顾剐关观馆惯贯广规归龟闺轨诡柜贵刽辊滚锅国过骇韩汉号阂鹤贺横恒轰鸿红壶护沪户哗华画划话怀坏欢环还缓换唤痪焕涣黄谎挥辉毁贿秽会烩汇讳诲绘荤浑获货祸击机积饥迹讥鸡绩缉极辑级挤几蓟剂济计记际继纪夹荚颊贾钾价驾歼监坚笺间艰缄茧检碱硷拣捡简俭减荐槛鉴践贱见键舰剑饯渐溅涧将浆蒋桨奖讲酱胶浇骄娇搅铰矫侥脚饺缴绞轿较阶节洁结诫届紧锦仅谨进晋烬尽劲荆茎鲸惊经颈静镜径痉竞净纠厩旧驹举据锯惧剧鹃绢觉决诀绝钧军骏开凯颗壳课垦恳抠库裤块侩宽矿旷况亏岿窥馈溃扩阔蜡腊莱来赖蓝栏拦篮阑兰澜谰揽览懒缆烂滥捞劳涝乐镭垒类泪篱离里鲤礼丽厉励砾历沥隶俩联莲连镰怜涟敛脸链恋炼练粮凉两辆谅疗辽镣猎临邻鳞凛赁龄铃灵岭领馏刘龙聋咙笼垄拢陇楼娄搂篓芦卢颅庐炉掳卤虏鲁赂禄录陆驴吕铝侣屡缕虑滤绿峦挛孪滦乱抡轮伦仑沦纶论萝罗逻锣箩骡骆络妈玛码蚂马骂吗买麦卖迈脉瞒馒蛮满谩猫锚铆贸么没镁门闷们锰梦眯谜弥觅幂绵缅庙灭悯闽鸣铭谬谋亩呐钠纳难挠脑恼闹馁内拟腻撵酿鸟聂啮镊镍柠狞宁拧泞钮纽脓浓农疟诺欧鸥殴呕沤盘庞抛赔喷鹏骗飘频贫苹凭评泼颇铺谱栖凄脐齐骑岂启气弃讫牵铅迁签谦钱钳潜浅谴堑枪呛墙蔷强抢锹桥乔侨翘窍窃钦亲寝轻氢倾顷请庆琼穷趋区躯驱龋颧权劝却鹊确让饶扰绕热韧认纫荣绒软锐闰润萨鳃赛叁伞丧骚扫涩杀刹纱筛删闪陕赡缮伤赏烧绍赊摄慑设绅审婶肾渗声绳胜圣师狮湿诗时蚀实识驶势适释饰视试寿兽枢输书赎属术树竖数帅双谁税顺说硕烁丝饲松耸怂颂讼诵擞苏诉肃虽随绥岁孙损笋缩琐锁獭挞态摊贪瘫滩坛谭谈叹汤烫涛绦讨腾誊锑题体屉条贴铁厅听烃铜统头秃图团颓蜕脱鸵驮驼椭洼袜弯湾顽万网韦违围为潍维苇伟伪纬谓卫温闻纹稳问挝蜗涡窝卧呜钨乌诬无芜吴坞雾务误锡牺袭习铣戏细虾辖峡侠狭厦吓鲜纤贤衔闲显险现献县馅羡宪线厢镶乡详响项萧嚣销晓啸蝎协挟携胁谐写泻谢锌衅兴汹锈绣虚嘘须许叙绪续轩悬选癣绚学勋询寻驯训讯逊压鸦鸭哑亚讶阉烟盐严颜阎艳厌砚彦谚验鸯杨扬疡阳养样瑶摇尧遥窑谣药爷页业叶医铱颐遗仪蚁艺亿忆义诣议谊译异绎荫阴银饮隐樱婴鹰应缨莹萤营荧蝇赢颖哟拥痈踊咏优忧邮铀犹诱于舆鱼渔娱与屿语狱誉预驭鸳渊辕园员圆缘远愿约跃钥粤悦阅云郧匀陨运蕴酝晕韵杂灾载攒暂赞赃脏凿枣责择则泽贼赠轧铡闸栅诈斋债毡盏斩辗崭栈占战绽张涨帐账胀赵蛰辙锗这贞针侦诊镇阵挣睁狰争帧郑证织职执只纸挚掷帜质滞钟终种肿众诌轴皱昼骤猪诸诛烛瞩嘱贮铸驻专砖转赚桩装妆壮状锥赘坠缀谆着浊兹资渍踪综总纵邹诅组钻亘睾芈啬厍厣靥赝匦匮赜刭刿剀伛伥伧伫侪侬俦俨俪俣偾偬偻傥傧傩氽佥籴黉冁凫兖衮亵脔禀冢讦讧讪讴讵讷诂诃诋诏诒诓诔诖诘诙诜诟诠诤诨诩诮诰诳诶诹诼诿谀谂谄谇谌谏谑谒谔谕谖谙谛谘谝谟谠谡谥谧谪谫谮谯谲谳谵谶卺陉陧邝邬邺郏郐郓郦刍奂劢巯垩圹坜垆垭垲埘埚埙芗苈苋苌苁苎茏茑茔茕荛荜荞荟荠荦荥荩荪荭莳莴莅莸莺萦蒇蒉蒌蓦蓠蓣蔹蔺蕲薮藓奁尴扪抟挢掴掼揿摅搌撄撷撸撺弑叽呒呓呖呗咛哒哓哔哕哙哜哝唛唠唢啧啭喽喾嗫嗳辔嘤噜囵帏帱帻帼岖岘岚峄峤峥崂崃嵘嵛嵝巅徕犷狯狲猃猡猕饧饨饩饪饫饬饴饷饽馀馄馊馍馐馑馔庑赓廪忏怃怄忾怅怆怿恸恹恻恺恽悭惬愠愦懔闩闫闱闳闵闶闼闾阃阄阆阈阊阌阍阏阒阕阖阗阙阚沣沩泷泸泺泾浃浈浍浏浒浔涞涠渎渑渖渌溆滟滠滢滗潆潇潋潴濑灏骞迩迳逦屦弪妩妪妫姗娅娆娈娲娴婵媪嫒嫔嫱嬷驵驷驸驺驿驽骀骁骅骈骊骐骒骓骖骘骛骜骝骟骠骢骣骥骧纡纣纥纨纩纭纰纾绀绁绂绉绋绌绗绛绠绡绨绫绮绯绲缍绶绺绻绾缁缂缃缇缈缋缌缏缑缒缗缙缜缛缟缡缢缣缤缥缦缧缪缫缬缭缯缱缲缳缵玑玮珏珑顼玺珲琏瑷璎瓒韪韫韬杩枥枨枞枭栉栊栌栀栎柽桠桡桢桤桦桧栾棂椟椠椤椁榄榇榈榉槟槠樯橥橹橼檩殁殇殒殓殚殡轫轭轲轳轵轶轸轹轺轼轾辁辂辄辇辋辍辎辏辘辚戋戗戬瓯昙晔晖暧贲贳贶贻贽赀赅赆赈赉赇赕赙觇觊觋觌觎觏觐觑毵氇氩氲牍胧胪胄胫脍脶腽膑欤飑飒飓飕飙毂齑斓炀炜炖烨焖焘祢祯禅怼悫懑戆泶矶砀砗砺砻硖硗碛碜礴龛睐睑畲罴羁钆钇钋钊钌钍钏钐钔钗钕钛钜钣钤钫钪钭钬钯钰钲钴钶钸钹钺钼钽钿铄铈铉铊铋铌铍铎铐铑铒铕铖铗铙铛铟铠铢铤铥铧铨铪铩铫铮铯铳铴铵铷铹铼铽铿锂锆锇锉锊锒锓锔锕锖锛锞锟锢锩锬锱锲锴锶锷锸锼锾镂锵镆镉镌镏镒镓镔镖镗镘镙镛镞镟镝镡镤镦镧镨镪镫镬镯镱镳锺穑鸠鸢鸨鸩鸪鸫鸬鸲鸱鸶鸸鸷鸹鸺鸾鹁鹂鹄鹆鹇鹈鹉鹌鹎鹑鹕鹗鹞鹣鹦鹧鹨鹩鹪鹫鹬鹭鹳疖疠痨痫瘅瘗瘿瘾癞癫窦窭裆裢裣裥褛褴皲耧聍聩顸颀颃颉颌颏颔颚颛颞颟颡颢颦虬虮虿蚬蛎蛏蛱蛲蛳蛴蝈蝾蝼蠼罂笃笕笾筚筝箦箧箨箪箫篑簖籁舣舻袅羟糁絷麸趱酽酾鹾趸跄跞跷跸跹跻踬踯蹑蹒蹰躏躜觞觯靓雳霁霭龀龃龅龆龇龈龉龊龌黾鼋鼍隽雠銮錾鱿鲂鲅鲈稣鲋鲎鲐鲒鲔鲕鲚鲛鲞鲟鲠鲡鲢鲣鲥鲦鲧鲨鲩鲫鲭鲮鲰鲱鲲鲳鲵鲶鲷鲻鲽鳄鳅鳆鳇鳌鳍鳎鳏鳐鳓鳔鳕鳗鳜鳝鳟鳢鞑鞯鹘髅髋髌魇魉飨餍鬓麽黩黪鼹";

var strBIG5 = "皚藹礙愛骯襖奧壩罷擺敗頒辦絆幫綁鎊謗剝飽寶報鮑輩貝鋇狽備憊繃筆畢斃幣痺閉邊編貶變辯辮標鱉別癟瀕濱賓擯餅並撥缽鉑駁補財採參蠶殘慚慘燦蒼艙倉滄廁側冊測層詫攙摻蟬饞讒纏鏟產闡顫場嘗長償腸廠暢鈔車徹塵陳襯撐稱懲誠騁遲馳恥齒熾沖寵疇躊籌綢櫥廚鋤雛礎儲觸處傳瘡闖創錘純綽辭詞賜聰蔥囪從叢湊躥竄錯達帶貸擔單鄲撣膽憚誕彈當擋黨蕩檔搗島禱導盜燈鄧敵滌遞締顛點墊電澱釣調諜疊釘頂錠訂丟東動棟凍犢獨讀賭鍍鍛斷緞兌隊對噸頓鈍奪墮鵝額訛惡餓兒爾餌貳發罰閥琺礬釩煩販飯訪紡飛誹廢費紛墳奮憤糞豐楓鋒風瘋馮縫諷鳳膚輻撫輔賦復負訃婦縛該鈣蓋趕稈贛岡剛鋼綱崗鎬擱鴿閣鉻個給龔宮鞏貢鉤溝構購夠蠱顧剮關觀館慣貫廣規歸龜閨軌詭櫃貴劊輥滾鍋國過駭韓漢號閡鶴賀橫恆轟鴻紅壺護滬戶嘩華畫劃話懷壞歡環還緩換喚瘓煥渙黃謊揮輝毀賄穢會燴匯諱誨繪葷渾獲貨禍擊機積飢跡譏雞績緝極輯級擠幾薊劑濟計記際繼紀夾莢頰賈鉀價駕殲監堅箋間艱緘繭檢鹼鹼揀撿簡儉減薦檻鑒踐賤見鍵艦劍餞漸濺澗將漿蔣槳獎講醬膠澆驕嬌攪鉸矯僥腳餃繳絞轎較階節潔結誡屆緊錦僅謹進晉燼盡勁荊莖鯨驚經頸靜鏡徑痙競淨糾廄舊駒舉據鋸懼劇鵑絹覺決訣絕鈞軍駿開凱顆殼課墾懇摳庫褲塊儈寬礦曠況虧巋窺饋潰擴闊蠟臘萊來賴藍欄攔籃闌蘭瀾讕攬覽懶纜爛濫撈勞澇樂鐳壘類淚籬離裡鯉禮麗厲勵礫歷瀝隸倆聯蓮連鐮憐漣斂臉鏈戀煉練糧涼兩輛諒療遼鐐獵臨鄰鱗凜賃齡鈴靈嶺領餾劉龍聾嚨籠壟攏隴樓婁摟簍蘆盧顱廬爐擄鹵虜魯賂祿錄陸驢呂鋁侶屢縷慮濾綠巒攣孿灤亂掄輪倫侖淪綸論蘿羅邏鑼籮騾駱絡媽瑪碼螞馬罵嗎買麥賣邁脈瞞饅蠻滿謾貓錨鉚貿麼沒鎂門悶們錳夢瞇謎彌覓冪綿緬廟滅憫閩鳴銘謬謀畝吶鈉納難撓腦惱鬧餒內擬膩攆釀鳥聶嚙鑷鎳檸獰寧擰濘鈕紐膿濃農瘧諾歐鷗毆嘔漚盤龐拋賠噴鵬騙飄頻貧蘋憑評潑頗鋪譜棲淒臍齊騎豈啟氣棄訖牽鉛遷簽謙錢鉗潛淺譴塹槍嗆牆薔強搶鍬橋喬僑翹竅竊欽親寢輕氫傾頃請慶瓊窮趨區軀驅齲顴權勸卻鵲確讓饒擾繞熱韌認紉榮絨軟銳閏潤薩鰓賽三傘喪騷掃澀殺剎紗篩刪閃陝贍繕傷賞燒紹賒攝懾設紳審嬸腎滲聲繩勝聖師獅濕詩時蝕實識駛勢適釋飾視試壽獸樞輸書贖屬術樹豎數帥雙誰稅順說碩爍絲飼鬆聳慫頌訟誦擻蘇訴肅雖隨綏歲孫損筍縮瑣鎖獺撻態攤貪癱灘壇譚談嘆湯燙濤絛討騰謄銻題體屜條貼鐵廳聽烴銅統頭禿圖團頹蛻脫鴕馱駝橢窪襪彎灣頑萬網韋違圍為濰維葦偉偽緯謂衛溫聞紋穩問撾蝸渦窩臥嗚鎢烏誣無蕪吳塢霧務誤錫犧襲習銑戲細蝦轄峽俠狹廈嚇鮮纖賢銜閑顯險現獻縣餡羨憲線廂鑲鄉詳響項蕭囂銷曉嘯蠍協挾攜脅諧寫瀉謝鋅舋興洶鏽繡虛噓須許敘緒續軒懸選癬絢學勛詢尋馴訓訊遜壓鴉鴨啞亞訝閹煙鹽嚴顏閻艷厭硯彥諺驗鴦楊揚瘍陽養樣瑤搖堯遙窯謠藥爺頁業葉醫銥頤遺儀蟻藝億憶義詣議誼譯異繹蔭陰銀飲隱櫻嬰鷹應纓瑩螢營熒蠅贏穎喲擁癰踴詠優憂郵鈾猶誘於輿魚漁娛與嶼語獄譽預馭鴛淵轅園員圓緣遠願約躍鑰粵悅閱雲鄖勻隕運蘊醞暈韻雜災載攢暫贊贓臟鑿棗責擇則澤賊贈軋鍘閘柵詐齋債氈盞斬輾嶄棧佔戰綻張漲帳賬脹趙蟄轍鍺這貞針偵診鎮陣掙睜猙爭幀鄭証織職執隻紙摯擲幟質滯鐘終種腫眾謅軸皺晝驟豬諸誅燭矚囑貯鑄駐專磚轉賺樁裝妝壯狀錐贅墜綴諄著濁茲資漬蹤綜總縱鄒詛組鑽亙睪羋嗇厙厴靨贗匭匱賾剄劌剴傴倀傖佇儕儂儔儼儷俁僨傯僂儻儐儺汆僉糴黌囅鳧兗袞褻臠稟塚訐訌訕謳詎訥詁訶詆詔詒誆誄詿詰詼詵詬詮諍諢詡誚誥誑誒諏諑諉諛諗諂誶諶諫謔謁諤諭諼諳諦諮諞謨讜謖謚謐謫譾譖譙譎讞譫讖巹陘隉鄺鄔鄴郟鄶鄆酈芻奐勱胇堊壙壢壚埡塏塒堝塤薌藶莧萇蓯苧蘢蔦塋煢蕘蓽蕎薈薺犖滎藎蓀葒蒔萵蒞蕕鶯縈蕆蕢蔞驀蘺蕷蘞藺蘄藪蘚奩尷捫摶撟摑摜撳攄榐攖擷擼攛弒嘰嘸囈嚦唄嚀噠嘵嗶噦噲嚌噥嘜嘮嗩嘖囀嘍嚳囁噯轡嚶嚕圇幃幬幘幗嶇峴嵐嶧嶠崢嶗崍嶸崳嶁巔徠獷獪猻獫玀獼餳飩餼飪飫飭飴餉餑餘餛餿饃饈饉饌廡賡廩懺憮慪愾悵愴懌慟懨惻愷惲慳愜慍憒懍閂閆闈閎閔閌闥閭閫鬮閬閾閶閿閽閼闃闋闔闐闕闞灃溈瀧瀘濼涇浹湞澮瀏滸潯淶潿瀆澠瀋淥漵灩灄瀅潷瀠瀟瀲瀦瀨灝騫邇逕邐屨弳嫵嫗媯姍婭嬈孌媧嫻嬋媼嬡嬪嬙嬤駔駟駙騶驛駑駘驍驊駢驪騏騍騅驂騭騖驁騮騸驃驄驏驥驤紆紂紇紈纊紜紕紓紺紲紱縐紼絀絎絳綆綃綈綾綺緋緄綞綬綹綣綰緇緙緗緹緲繢緦緶緱縋緡縉縝縟縞縭縊縑繽縹縵縲繆繅纈繚繒繾繰繯纘璣瑋玨瓏頊璽琿璉璦瓔瓚韙韞韜榪櫪棖樅梟櫛櫳櫨梔櫟檉椏橈楨榿樺檜欒櫺櫝槧欏槨欖櫬櫚櫸檳櫧檣櫫櫓櫞檁歿殤殞殮殫殯軔軛軻轤軹軼軫轢軺軾輊輇輅輒輦輞輟輜輳轆轔戔戧戩甌曇曄暉曖賁貰貺貽贄貲賅贐賑賚賕賧賻覘覬覡覿覦覯覲覷毿氌氬氳牘朧臚冑脛膾腡膃臏歟颮颯颶颼飆轂齏斕煬煒燉燁燜燾檷禎禪懟愨懣戇澩磯碭硨礪礱硤磽磧磣礡龕睞瞼畬羆羈釓釔釙釗釕釷釧釤鍆釵釹鈦鉅鈑鈐鈁鈧鈄鈥鈀鈺鉦鈷鈳鈽鈸鉞鉬鉭鈿鑠鈰鉉鉈鉍鈮鈹鐸銬銠鉺銪鋮鋏鐃鐺銦鎧銖鋌銩鏵銓鉿鎩銚錚銫銃鐋銨銣鐒錸鋱鏗鋰鋯鋨銼鋝鋃鋟鋦錒錆錛錁錕錮錈錟錙鍥鍇鍶鍔鍤鎪鍰鏤鏘鏌鎘鐫鎦鎰鎵鑌鏢鏜鏝鏍鏞鏃鏇鏑鐔鏷鐓鑭鐠鏹鐙鑊鐲鐿鑣鍾穡鳩鳶鴇鴆鴣鶇鸕鴝鴟鷥鴯鷙鴰鵂鸞鵓鸝鵠鵒鷴鵜鵡鵪鵯鶉鶘鶚鷂鶼鸚鷓鷚鷯鷦鷲鷸鷺鸛癤癘癆癇癉瘞癭癮癩癲竇窶襠褳襝襉褸襤皸耬聹聵頇頎頏頡頜頦頷顎顓顳顢顙顥顰虯蟣蠆蜆蠣蟶蛺蟯螄蠐蟈蠑螻蠷罌篤筧籩篳箏簀篋籜簞簫簣籪籟艤艫裊羥糝縶麩趲釅釃鹺躉蹌躒蹺蹕躚躋躓躑躡蹣躕躪躦觴觶靚靂霽靄齔齟齙齠齜齦齬齪齷黽黿鼉雋讎鑾鏨魷魴鱍鱸穌鮒鱟鮐鮚鮪鮞鱭鮫鯗鱘鯁鱺鰱鰹鰣鰷鯀鯊鯇鯽鯖鯪鯫鯡鯤鯧鯢鯰鯛鯔鰈鱷鰍鰒鰉鰲鰭鰨鰥鰩鰳鰾鱈鰻鱖鱔鱒鱧韃韉鶻髏髖髕魘魎饗饜鬢麼黷黲鼴";

var keyCode = new Array(32, 33, 34, 35, 36, 37, 38, 39, 40, 41, 42, 43, 44, 45, 46, 47, 58, 59, 60, 61, 62, 63, 64, 91, 92, 93, 94, 95, 96, 123, 124, 125, 126, 65306, 12298, 12299, 12296, 12297, 8216, 8217, 8220, 8221, 65288, 65289, 65339, 65341, 65371, 65373, 8212, 8230);
var keyTrans = new Array("　", "！", "″", "＃", "＄", "％", "＆", "′", "︵", "︶", "＊", "＋", "，", "－", "·", "／", "‥", "；", "︿", "＝", "﹀", "？", "＠", "︹", "﹨", "︺", "＾", "＿", "‵", "︷", "｜", "︸", "～", "‥", "︽", "︾", "︿", "﹀", "﹁", "﹂", "﹃", "﹄", "︵", "︶", "︹", "︺", "︷", "︸", "┃", "┆");

var keyMap = new Array();
for (i = 0; i < keyCode.length; i++)
keyMap[keyCode[i]] = keyTrans[i];

var hanziMap = new Array();
for (i = 0; i < strGB.length; i++)
hanziMap[strGB.charCodeAt(i)] = strBIG5.charAt(i);

function h() {
var ws = parseInt(document.getElementById("iH").value);
var H = parseInt(document.getElementById("iW").value);
var sp = document.getElementById("iS").value;
var SS = new Array();
var vx = document.getElementById("srcText").value;
var t = "";

for (var x = 0; x < vx.length; x++) {
var xCode = vx.charCodeAt(x);
if (xCode == 9 || xCode == 13)
continue;

if (xCode == 10) {
SS[SS.length] = t;
t = "";
}
else {
if (t.length >= ws) {
SS[SS.length] = t;
t = "";
}

if (xCode >= 65 && xCode <= 90)
t = t + String.fromCharCode(65313 + xCode - 65);
else if (xCode >= 97 && xCode <= 122)
t = t + String.fromCharCode(65345 + xCode - 97);
else if (xCode >= 48 && xCode <= 57)
t = t + String.fromCharCode(65296 + xCode - 48);
else if (keyMap[xCode] != null)
t = t + keyMap[xCode];
else if (document.getElementById("iscbig5checkbox").checked == true) {
if (hanziMap[xCode] != null)
t = t + hanziMap[xCode];
else
t = t + vx.charAt(x);
}
else
t = t + vx.charAt(x);
}
}

SS[SS.length] = t;

var v1 = SS.length % H;
if (v1 != 0) {
for (var x = v1; x < H; x++)
SS[SS.length] = "";
}

str = " ";

var p1 = 0;
var ll = SS.length;

while (p1 < ll) {
var p2 = p1 + H - 1 < ll ? p1 + H - 1 : ll - 1;
for (var y = 0; y < ws; y++) {
for (var x = p2; x >= p1; x--) {
if (SS[x].length > y) {
if (SS[x].charCodeAt(y) > 127)
str = str + SS[x].charAt(y) + sp;
else
str = str + SS[x].charAt(y) + " " + sp;
}
else {
str = str + "　" + sp;
}
}
str = str + "\n ";
}
str = str + S;
p1 = p2 + 1;
}

document.getElementById("tarText").value = str;
}

function copyText() {

var textArea = document.getElementById("tarText");
textArea.select();
textArea.setSelectionRange(0, 99999);

document.execCommand("copy");

}

</script>
</head>

<body>
<div class="container">
<div class="title">
<h1>文字竖排转换器</h1>
</div>

<div class="textarea-container">
<textarea id="srcText" name="s1" placeholder="请输入要转换的文字..." rows="10"></textarea>
</div>

<div class="input-group">
<label for="iS">分隔符：</label>
<input type="text" id="iS" name="T1" value="|" size="3" maxlength="10">

<label for="iW">页宽：</label>
<input type="number" id="iW" name="T2" value="6" size="3">

<label for="iH">页高：</label>
<input type="number" id="iH" name="T3" value="15" size="3">
</div>

<div class="input-group">
<label>繁体</label>
<input type="checkbox" id="iscbig5checkbox">
<button style="width: 90px; height: 30px;" onclick="h()">转换</button>
<button style="width: 90px; height: 30px;" onclick="copyText()">复制</button>
<button style="width: 90px; height: 30px;" onclick="document.getElementById('srcText').value=''">清除</button>
</div>

<div class="textarea-container">
<textarea id="tarText" name="s2" placeholder="转换后的文字将显示在这里..." rows="10" readonly></textarea>
</div>

<div>
<p><b>使用说明：</b><br>一个仿古书排版样式的文字竖排工具。在上面的文本框输入一段文字，点击转换按钮即可在下方看到输出的样式。</p>
<p>在使用本工具时，可以设置一些条件以改变输出样式：<br>
<span style="color:#0066ff">分隔字符</span>：输出样式中用于分隔竖排文字的字符，可以随意使用任何字符。同时，你还可以使用多个字符来分隔。<br>
<span style="color:#0066ff">页宽</span>：设置文字竖排的列数。<br>
<span style="color:#0066ff">页高</span>：设置文字竖排的列高字符数。<br>
<span style="color:#0066ff">繁体</span>：将简体汉字转换成繁体汉字输出。
</p>
<p><b>提示：</b><br>灵活设置分隔字符、页宽和页高，会有意想不到的效果哦！</p>
</div>

</div>

</body>

</html>

登录

[程序员] 人手一个工具站：文字竖排(开源单 html 文件)

已推荐帖子

小天管理

创建帐户或登录来提出意见

创建帐户

登录

游客注册

游客注册

会员

最新的状态更新

最近查看

下载

我的钱包

动态