zoukankan      html  css  js  c++  java
  • 网页中超链接的简化问题(如何避免超链接的get提交)

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

    <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提交,这就避免了当初出现的不必要的麻烦。而且这样做,不会将某些服务器需要的数据显示在地址栏。

  • 相关阅读:
    Seata-一站式分布式事务解决方案
    nginx相关
    module in JavaScript
    es6this箭头函数
    Python3爬虫:(一)爬取拉勾网公司列表
    markdoen语法
    吴裕雄--天生自然TensorFlow2教程:维度变换
    吴裕雄--天生自然TensorFlow2教程:numpy [ ] 索引
    吴裕雄--天生自然TensorFlow2教程:创建Tensor
    吴裕雄--天生自然TensorFlow2教程:Tensor数据类型
  • 原文地址:https://www.cnblogs.com/blog411032/p/5343055.html
Copyright © 2011-2022 走看看