form表单传递参数乱码解决方案

今天在处理一个搜索问题,挺简单的需求,就是输入框里面输入关键字,然后通过url把参数传递给后台,点击提交按钮的时候把获取到的关键词放到form的action,然后提交

	//提交表单方法
	function doSubmitDiqu(){
		var keyword = $("#SearchWordId").val();
		$("#searchForm").attr("action", "${pageContext.request.contextPath}/rmjgjh/search?keyword="+keyword);
		$("#searchForm").submit();
	}

form表单传递参数乱码解决方案_第1张图片
然后发现后台获取到的参数是这样的,但是url是正常的
在这里插入图片描述

解决方案1
js文件中使用encodeURI()方法,

	//提交表单
	function doSubmitDiqu(){
		var keyword = $("#SearchWordId").val();
		var text = encodeURI(encodeURI(keyword));  
		$("#searchForm").attr("action", "${pageContext.request.contextPath}/rmjgjh/search?keyword="+text);
		$("#searchForm").submit();
	}

后台进行decode解码,这样确实接收到的参数不会乱码了
form表单传递参数乱码解决方案_第2张图片
但是浏览器看到的也是一串加密串,不符合需求
在这里插入图片描述

解决方案2
在tomcat的server.xml文件中增加一句 URIEncoding=“UTF-8”
form表单传递参数乱码解决方案_第3张图片

在这里插入图片描述
form表单传递参数乱码解决方案_第4张图片

这样该问题完美解决,浏览器既可以明文传参,后台也可以获取到正确的参数

你可能感兴趣的:(前端)