zoukankan      html  css  js  c++  java
  • 工程分享-带参数跳转等内容

    首先,在制作网页中,想实现在点击提交按钮后,根据当前按钮的不同,将按钮信息附加到链接的后边,如下图所示:

    上图中,链接后的id=LJQ,就是实现带参数跳转,之后便于在跳转页根据id=X;根据x不同,实现不同加载图片等内容;

    接下来是如何实现带参数跳转:

     1 $('.detailChart').on( "click", function () {
     2                  //编写点击对应的事件
     3         var result={
     4                 "name":jQuery(this).attr("id")
     5         }        //该方法也就是上一个工程分享的:格式化对象
     6            $.ajax({
     7                   //ajax方式发送请求
     8                type: "POST",
     9                url: "postIndName.action",
    10                dataType:"text",
    11                   //ajax返回值设置为text(json格式也可用它返回,可打印出结果,也可设置成json)
    12                data:result,
    //result中包含着获取到的id信息 13 success: function(json){ 14 var url=window.location.pathname; 15 if(url=='/PEEMES/xitongfenxi.jsp') 16 self.location='/PEEMES/xitongzhibiao.jsp?id='+result.name;
    //在该处实现带参数的链接 17 } 18 }); 19 });

    接下来讲解,如何对带参数链接进行解析呢?

    1     var a=getQueryString("id");
    2     function getQueryString(name){  
    3            //正则表达式方法获得url中?后的参数值
    4     var reg=new RegExp("(^|&)"+name+"=([^&]*)(&|$)","i");
    5     var r=window.location.search.substr(1).match(reg);
    6     if(r!=null) return unescape(r[2]);
    7     return null;
    8 }

    解释:

          首先理解定义的正则表达式,(^|&)意思是从头开始匹配字符&, =([^&]*)意思是匹配=后面零个或多个不是&的字符,直至碰到第一个&为止,(&|$)意思就是匹配最后一个&,在正则表达式中,增加一个()代表着匹配数组中增加一个值, 因此代码中的正则匹配后数组中应包含4个值, 在getQueryString("name")函数中,此时 r 获取到的数组应该是 ["name=elephant&", "", "elephant", "&"]

      代码中 window.location.search 意思是取window.location中 '?'后面的值包括'?',因此所得到的值是"?name=elephant&age=25&sex=male"

      substr()这个函数的作用是截取字符串,在代码中window.location.search.surstr(1) 意思就是截取第一个字符后面的字符串,所得到的值即是"name=elephant&age=25&sex=male"

          unescape这个函数的作用是解码escape编码后的字符串

    如何实现获得url中所有信息?

     1 function parse_url(_url){ //定义函数
     2   var pattern = /(w+)=(w+)/ig;//定义正则表达式
     3   var parames = {};//定义数组
     4   url.replace(pattern, function(a, b, c){
     5     parames[b] = c;
     6   });
     7   return parames;//返回这个数组.
     8 }
     9 
    10 var  url = "http://www.baidu.com?name=elep&age=25&sex=male" 
    11 var params = parse_url(url);// ["name=elep", "age=25", "sex=male"]

           当replace匹配到name=elep时.那么就用执行function(a,b,c);其中a的值为:name=elep,b的值为name,c的值为elep;(这是反向引用.因为在定义正则表达式的时候有两个子匹配.),然后将数组的key为name的值赋为elephant;然后完成.

      再继续匹配到age=25;此时执行function(a,b,c);其中a的值为:age=25,b的值为age,c的值为25;然后将数组的key为id的值赋为25.  

       接下来,可以根据不一样的参数信息,得到进行不同实现:

     1          //Jquery实现不同加载图片
     2          var b=a.split("_");
     3        //对获取到的含有变量的a进行处理;
     4     if(a=="DG_XT_004")
     5         {
     6           src=src+"energy.bmp";//加载图片名为energy.bmp
     7           $(".expression").html("123");//表达式为:123
     8         }
     9     else if(a=="DG_XT_005"){
    10         src=src+"yield.bmp";//加载图片名为:yield.bmp
    11         $(".expression").html("456");//表达式为:465
    12     }
    13         

        一个小小的实现,希望与大家同学习,共进步~

  • 相关阅读:
    Portable Executable 可移植可执行
    汇编跳转指令
    Java中this和super
    Java成员变量和类变量
    EasyUI select
    JAVA虚函数
    感想
    函数
    ueditor
    gitlab简介配置和参数修改
  • 原文地址:https://www.cnblogs.com/lujun1949/p/5712727.html
Copyright © 2011-2022 走看看