찾다

 >  Q&A  >  본문

javascript - jquery 纯html页面之间如何传递参数??

a页面的一段代码

<li id="template">
    <a href="course/course_detail.html" data-ajax='false'>
        <img src="images/01.png" id="_img"/>
        <h3 id="Course_Name"></h3>
        <p>
            讲师:<span id="Teachername"></span>
            时长<span id="Credit_hour"></span>分钟
            时间:<span id="Course_CreateDate"></span>
        </p>
    </a>
</li>

b页面的一段代码

      <tr>
        <td class="table_1">课程名称:</td>
        <td colspan="3" class="table_2">心情美好</td>
      </tr>
      <tr>
        <td class="table_1">时长:</td>
        <td class="table_1">2</td>
        <td class="table_1">讲师:</td>
        <td class="table_2">专家团</td>
      </tr>

我想把a页面 li 里面每个 span 标签 id 获取到的值,传到b页面对应的 td 里,求指导。

黄舟黄舟2895일 전727

모든 응답(8)나는 대답할 것이다

  • ringa_lee

    ringa_lee2017-04-10 12:49:43

    来自 iteye 的文章:HTML5本地存储不完全指南

    如果你的程序需要在不同页面访问同一个值,你可能需要了解这个值是否已经被其他页面改变了,这可以通过向浏览器注册storage事件来实现:

    window.addEventListener('storage', function(e) {
        console.log(e.key + "'s value is changed from '" +
            e.oldValue + "' to '" + e.newValue + "' by " + e.url);
    }, false);
    
    //A页面
    localStorage['foo'] = 'bar';
    
    //B页面
    localStorage['foo'] = 'newBar';
    

    这时你应该会在 A 页面的 Console 中看到:

    foo’s value is changed from ‘bar’ to ‘newbar’ by http://localhost/test.html 
    

    회신하다
    0
  • ringa_lee

    ringa_lee2017-04-10 12:49:43

    一句话概括,纯html页面之间的传值可以通过url后面的参数进行比如:

    b.html?teacher=xx&time=xxx
    

    回到问题中,首先从a.html到b.html需要一个跳转方式,比方说在a.html页面里面你有一个链接:

    <a href="b.html" id="toPageB">跳转到b页面</a>
    

    剩下的就好办了,依次取得你需要的参数,然后修改页面url:

    var dataFromLi=[$("#Teachername").text(),$("#Credit_hour").text()];
    $("#toPageB").attr("href","b.html?data="+dataFromLi);
    

    然后在b.html页面解析url,获取参数。


    更新,如何根据url获取参数:

    window.location.search 会返回所有地址栏从“?”开始的字符串。获取某个参数值可以通过正则,下面是一个简单的获取参数的函数:

    function getURLParameter(name) {
        return decodeURIComponent((new RegExp('[?|&]' + name + '=' + '([^&;]+?)(&|#|;|$)').exec(location.search)||[,""])[1].replace(/\+/g, '%20'))||null;
    }
    

    如果你采用jQuery,你可以用更简单的办法:

    $.url().param('data');
    

    회신하다
    0
  • PHPz

    PHPz2017-04-10 12:49:43

    总结一下:

    方法有 2 种:

    1. 通过 url 传递
    2. 通过本地存储

    第一种方法:http://segmentfault.com/q/1010000000308712#a-1020000000308821
    第二种方法:http://segmentfault.com/q/1010000000308712#a-1020000000308852

    회신하다
    0
  • 迷茫

    迷茫2017-04-10 12:49:43

    location.search可以返回从"?"开始的值。

    你可以用以下专业第三方库进行获取值操作:
    uri.js
    parseURL.js

    회신하다
    0
  • 怪我咯

    怪我咯2017-04-10 12:49:43

    a,b页面同用一个js文件,然后将a页面li里面每个span 标签id获取到的值,保存到一个js的全局变量中,在加载b页面通过js创建table,

    회신하다
    0
  • 天蓬老师

    天蓬老师2017-04-10 12:49:43

    html5的话可以用 sessionStorage 或 localStorage

    很容易的

    sessionStorage 是会话存储,关闭浏览器就没了

    localStorage 是持久化存储,完全可以替代cookie 存储空间更大。

    实现方法

    存:sessionStorage["par1"]="123";

    取:sessionStorage["par1"]

    localStorage实现方法和sessionStorage一样

    회신하다
    0
  • 怪我咯

    怪我咯2017-04-10 12:49:43

    要么就是URL 传参,要么就是用COOKIE

    회신하다
    0
  • 伊谢尔伦

    伊谢尔伦2017-04-10 12:49:43

    javascript获取url参数的值

    회신하다
    0
  • 취소회신하다