Js实现中文编码与解码功能

最新推荐文章于 2024-03-14 16:07:35 发布

suwu150

最新推荐文章于 2024-03-14 16:07:35 发布

阅读量8k

点赞数 1

分类专栏： JavaScript 文章标签： javascript java

本文链接：https://blog.csdn.net/suwu150/article/details/53044456

版权

JavaScript 专栏收录该内容

56 篇文章 4 订阅

订阅专栏

在网页的url中，我们经常会遇到明显的中文，这样的传输会遇到很多问题，我们使用escape进行对其中的中文进行编码

代码如下所示

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>中文编码</title>
<script type="text/javascript">
	function init()
	{
		console.log("init()");
		var btn_escape=document.getElementById("btn_escape");
		btn_escape.οnclick=function()
		{
			var escapeResult=document.getElementById("escape");
			var escapeValue=escape(escapeResult.value);
			var unescape=document.getElementById("unescape");
			unescape.value=escapeValue;
			
		}
		var btn_escape_clear=document.getElementById("btn_escape_clear");
		btn_escape_clear.οnclick=function()
		{
			var escapeResult=document.getElementById("escape");
			escapeResult.value="";
		}
		var btn_unescape=document.getElementById("btn_unescape");
		btn_unescape.οnclick=function()
		{
			var unescapeResult=document.getElementById("unescape");
			var unescapeValue=unescape(unescapeResult.value);
			var escape=document.getElementById("escape");
			escape.value=unescapeValue;
			
		}
		var btn_unescape_clear=document.getElementById("btn_unescape_clear");
		btn_unescape_clear.οnclick=function()
		{
			var unescapeResult=document.getElementById("unescape");
			unescapeResult.value="";
		}
	}
</script>
<style type="text/css">
	div
	{
		width: 500px;
		height: 300px;
		margin: 0 auto;
	}
</style>
</head>
<body οnlοad="init();">
	<div >
		<textarea id="escape" rows="10" cols="80"></textarea>
		<button id="btn_escape">转换</button>
		<button id="btn_escape_clear">清除</button>
	</div>
	<div >
		<textarea id="unescape" rows="10" cols="80"></textarea>
		<button id="btn_unescape">转换</button>
		<button id="btn_unescape_clear">清除</button>
	</div>
</body>
</html>

在上面的页面中，我们将javaScript嵌入到html页面中，在页面中，我们使用了四个函数进行了实现这样的功能，其中主要是用的函数是escape()，这样我们就完成了编码与解码功能，在我们查找具体的标签时，我们使用var escapeResult=document.getElementById("escape");这种方式，进行id 的关联，然后再进行对其标签的操作

下面就是实现的效果图：

也可以使用以下方式实现同样的功能：

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
	<head>
	<title>test.html</title>
	</head>

	<body>
		<form name="form1">
			<textarea name="area1" rows="5" cols="50"></textarea>
			<p>
				<input type="button" value="转换" οnclick="test_encoding()" />
				<input type="reset" value="clear" />
			</p>
		</form>
		
		<form name="form2">
			<textarea name="area2" rows="5" cols="50"></textarea>
			<p>
			<input type="button" value="转换" οnclick="test_unencoding()" />
				<input type="reset"  value="clear" />
			</p>
		</form>
	</body>

	<script type="text/javascript">
		//escape函数把汉字转换成ASCII码
		//unescape函数ASCII码把转换成汉字
		var area1 = document.form1.area1;
		var area2 = document.form2.area2;
		function test_encoding(){
			area2.value=escape(area1.value);
		}
		function test_unencoding(){
			area1.value=unescape(area2.value);
		}
	</script>
</html>

suwu150

关注

1
点赞
踩
0

收藏

觉得还不错? 一键收藏
打赏
0
评论
Js实现中文编码与解码功能

在网页的url中，我们经常会遇到明显的中文，这样的传输会遇到很多问题，我们使用escape进行对其中的中文进行编码代码如下所示中文编码 function init() { console.log("init()"); var btn_escape=document.getElementById("btn_escape"); btn_escape.onclick=f
复制链接

扫一扫