关于jquery与strus1,x实现ajax的一些问题

最新推荐文章于 2025-12-20 00:32:11 发布

原创最新推荐文章于 2025-12-20 00:32:11 发布 · 116 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#jQuery #Ajax #Struts #json #Apache #ViewUI

本文详细探讨了使用jQuery AJAX提交包含中文的表单时遇到的乱码问题，并解释了其背后的原因。通过对比不同实现方式，作者最终发现了问题的关键在于所使用的jQuery form插件版本过旧，导致中文字符无法正确传输到后端。文章还提供了解决方法，包括更新插件版本和调整表单提交策略。

最近几天经常纠结于jquery的麻烦啊。这种情况下报那种，换了另外一种情况又报奇怪的错。都快让人纠结死吧。
唉。只能在这里发发牢骚了啊。纯属无奈之举.错误的例子我已经在je的问题模块提出啦，不知道有谁能给解答下.
整个页面的代码如下：


<%@ page language="java" pageEncoding="utf-8"%>

<%@ taglib uri="http://struts.apache.org/tags-bean" prefix="bean"%>
<%@ taglib uri="http://struts.apache.org/tags-html" prefix="html"%>
<%@ taglib uri="http://struts.apache.org/tags-logic" prefix="logic"%>
<%@ taglib uri="http://struts.apache.org/tags-tiles" prefix="tiles"%>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
	<html:base />

	<title>jquery_ajax.jsp</title>

	<meta http-equiv="pragma" content="no-cache">
	<meta http-equiv="cache-control" content="no-cache">
	<meta http-equiv="expires" content="0">
	<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
	<meta http-equiv="description" content="This is my page">
	<!--
	<link rel="stylesheet" type="text/css" href="styles.css">
	-->
	<script type="text/javascript" src="js/jquery.js"></script>
	<script type="text/javascript" src="js/jquery.form.js"></script>
	<script type="text/javascript">
		$(document).ready(function(){
			$("#login").click(function(){
				$.ajax({
					type:"get",
					url:"jquery.do?ope=doShow",
					data:'userName='+$("#usr").val()+"&pwd="+$("#pwd").val(),
					success:function(json){
						 var users = eval('(' + json + ')');
						 $.each(users,function(i,user){
						 	$("#result").append(i+"name:"+user.itemName+"pwd:"+user.itemOp)
						 });
					}
				})

			});			
		})	
	</script>
	</head>
<body>

		<table border="0">
			<tr>
				<td>
					Login:
				</td>
				<td>
					<input type="text" name="userName" id="usr" />
				</td>
			</tr>
			<tr>
				<td>
					Password:
				</td>
				<td>
					<input type="text" id="pwd" name="pwd" />
				</td>
			</tr>
			<tr>
				<td colspan="2" align="center">
					<button id="login">
						登录
					</button>
				</td>
			</tr>
		</table>

	<div id="result"></div>

	<form id="form2" action="">
         //本来是打算一个页面放多个表单的，但是现在一个表单都没有搞定，那多个就只能放在一边了.
	</form>
</body>
</html>

如果我在table放置form并改变上面的javascript代码，错误都摸不着头绪啊.
如果我把页面的javascript代码改变成如下所示代码：

<script type="text/javascript" src="js/jquery.js"></script>
    <script type="text/javascript" src="js/jquery.form.js"></script>
    <script type="text/javascript">
        $(document).ready(function(){
            $("#login").click(function(){

                var options = {
                target:"#result",
                type:"get",
                success:showResponse,
                resetForm:true,
                url:"jquery.do?ope=doShow"};

                $("#myForm1").ajaxForm(options);

            });

            function showResponse(xml){//回调函数
                    alert(xml);
            }                    
        })   
    </script>
    </head>
<body>
    <form id="myForm1" method="post">
        <table border="0">
            <tr>
                <td>
                    Login:
                </td>
                <td>
                    <input type="text" name="userName" id="usr" />
                </td>
            </tr>
            <tr>
                <td>
                    Password:
                </td>
                <td>
                    <input type="text" id="pwd" name="pwd" />
                </td>
            </tr>
            <tr>
                <td colspan="2" align="center">
                    <button id="login">
                        登录
                    </button>
                </td>
            </tr>
        </table>
    </form>

提交英文就变的没有问题，但是提交中文为在action打印出null，返回到页面的值自然是""啦，不过我在action给另外一个属性赋值(值为中文)，返回到页面没有错，也没有乱码.
我就想在jquery把页面的中文值提交给后台的时候肯定出现什么异常.

最后的问题是：
[color=blue][b]原来是自己下载的jquery.form.js这个插件的版本太老啊...[/b][/color][size=small][/size]