码迷,mamicode.com
首页 > Web开发 > 详细

网页中超链接的简化问题(如何避免超链接的get提交)

时间:2016-03-31 23:20:28      阅读:226      评论:0      收藏:0      [点我收藏+]

标签:

废话不多,直接看例子吧:

<a href="###?key=${*** }">跳转</a>

上面这个超链接被点击后,肯定会向某个控制器发送一个get请求,而其中key后面的数据会显示在地址栏内,如果有中文的话,可能还会出现乱码等情况。所以直接用超链接传送数据不是一个好的选择。下面有一个更好的办法来解决这个问题:

<a style="text-decoration: underline;cursor: pointer;color: blue;" onclick="update(‘${user.userName }‘)">跳转</a>

可以看出,在这段代码内,我把超链接内的 href 属性去掉了,当然添加CSS代码来弥补超链接失去href 后的样式,我称该<a></a>标签为:伪链接。

OK,我在伪链接内添加了一个onclick点击事件,这样当点击该伪链接的时候就会触发这个js函数。然后看下面这段代码:

<form action="" method="post">
        <input type="hidden" id="userName" name="userName"/>
 </form>
function update(userName){
                document.getElementById(‘userName‘).value = userName;
                document.forms[0].action = ‘*****.do‘;
                document.forms[0].submit();
            }

很容易看出,我在页面添加了一个form标签,form标签内有一个隐藏的input标签,隐藏的input标签用来承载原超链接要传送的数据,这里我通过js的点击事件,把数据封装到隐藏的input内,而input所在的form使用post提交,这就避免了当初出现的不必要的麻烦。而且这样做,不会将某些服务器需要的数据显示在地址栏。

网页中超链接的简化问题(如何避免超链接的get提交)

标签:

原文地址:http://www.cnblogs.com/blog411032/p/5343055.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!