将所选参数从页面传递到另一页面

时间:2014-12-30 06:54:31

标签: javascript jquery html

我有2页:
Moods page

<div class="sm_img">

        <img src="img/angelic - Copy - Copy - Copy (2).png" /> <span
            id="angelic">Angelic</span>

    </div>

    <div class="sm_img">

        <img src="img/angry - Copy - Copy - Copy.png" /> <span id="angry">Angry</span>

    </div>

    <div class="sm_img">

        <img src="img/anxious - Copy - Copy - Copy.png" /> <span id="anxious">Anxious</span>

    </div>

    <div class="sm_img">

        <img src="img/assertive - Copy - Copy.png" /> <span id="asserive">Assertive</span>

    </div>

    <div class="sm_img">

        <img src="img/bored - Copy - Copy.png" /> <span id="bored">Bored</span>

    </div>

    <div class="sm_img">

        <img src="img/confident - Copy - Copy.png" /> <span id="confident">Confident</span>

    </div>

    <div class="sm_img">

        <img src="img/cranky - Copy - Copy.png" /> <span id="cranky">Cranky</span>

    </div>

    <div class="sm_img">

        <img src="img/depressed - Copy - Copy.png" /> <span id="depressed">Depressed</span>

    </div>

    <div class="sm_img">

        <img src="img/dissapointed - Copy - Copy.png" /> <span
            id="disappointed">Dissapointed</span>

    </div>

    <div class="sm_img">

        <img src="img/distrustful - Copy - Copy.png" /> <span
            id="distrustful">Distrustful</span>

    </div>

    <div class="sm_img">

        <img src="img/embarrassed - Copy.png" /> <span id="embarassed">Embarrassed</span>

    </div>

    <div class="sm_img">

        <img src="img/emotional - Copy.png" /> <span id="emotional">Emotional</span>

    </div>

    <div class="sm_img">

        <img src="img/evil - Copy.png" /> <span id="evil">Evil</span>

    </div>

    <div class="sm_img">

        <img src="img/excited - Copy.png" /> <span id="excited">Excited</span>

    </div>

    <div class="sm_img">

        <img src="img/exhusted.png" /> <span id="exhausted">Exhusted</span>

    </div>

    <div class="sm_img">

        <img src="img/flirtatious.png" /> <span id="flirt">flirtatious</span>

    </div>

    <div class="sm_img">

        <img src="img/forgetful.png" /> <span id="forget">forgetful</span>

    </div>  

Javascript:

function saveSmileys() {
        /* var a = document.getElementById("angelic");
        var b = document.getElementById("angry");
        var c = document.getElementById("anxious");
        var d = document.getElementById("assertive");
        var e = document.getElementById("bored");
        var f = document.getElementById("confident");
        var g = document.getElementById("cranky");
        var h = document.getElementById("depressed");
        var i = document.getElementById("disappointed");
        var j = document.getElementById("distrustful");
        var k = document.getElementById("emotional");
        var l = document.getElementById("evil");
        var m = document.getElementById("excited");
        var n = document.getElementById("exhausted");
        var o = document.getElementById("flirt");
        var p = document.getElementById("forget");
         */
        /* if (a & b & c & d & e & f & g & h & i & j & k & l & m & n & o
                & p == true) { */

        /*          var ang = parseInt(a);
         var an = parseInt(b);
         var anx = parseInt(c);
         var asse = parseInt(d);
         var bo = parseInt(e);
         var co = parseInt(f);
         var cr = parseInt(g);
         var de = parseInt(h);
         var dis = parseInt(i);
         var distr = parseInt(j);
         var em = parseInt(k);
         var ev = parseInt(l);
         var ex = parseInt(m);
         var exh = parseInt(n);
         var fl = parseInt(o);
         var fo = parseInt(p); */

        $(function() {
            $("#savesmiley").bind(
                    "click",
                    function() {
                        var url = "notes.html?Angelic="
                                + encodeURIComponent($("#angelic").val())
                                + "&Angry="
                                + encodeURIComponent($("#angry").val())
                                + "&Anxious="
                                + encodeURIComponent($("#anxious").val())
                                + "&Assertive="
                                + encodeURIComponent($("#assertive").val())
                                + "&Bored="
                                + encodeURIComponent($("#bored").val())
                                + "&Confident="
                                + encodeURIComponent($("#confident").val())
                                + "&Cranky="
                                + encodeURIComponent($("#cranky").val())
                                + "&Depressed="
                                + encodeURIComponent($("#depressed").val())
                                + "&Disappointed="
                                + encodeURIComponent($("#disappointed").val())
                                + "&Distrustful="
                                + encodeURIComponent($("#distrustful").val())
                                + "&Embarassed="
                                + encodeURIComponent($("#embarassed").val())
                                + "&Emotional="
                                + encodeURIComponent($("#emotional").val())
                                + "&Evil="
                                + encodeURIComponent($("#evil").val())
                                + "&Excited="
                                + encodeURIComponent($("#excited").val())
                                + "&Exhausted="
                                + encodeURIComponent($("#exhausted").val())
                                + "&Flirtatious="
                                + encodeURIComponent($("#flirt").val())
                                + "&Forgetful="
                                + encodeURIComponent($("#forget").val());
                        window.location.href = url;
                        console.log(url);
                    });
            var QueryString = function() {

                var query_string = url;
                var query = window.location.search.substring(1);
                var vars = query.split("&");
                for (var i = 0; i = vars.length; i++) {

                    var pair = vars[i].split("=");
                    if (typeof query_string[pair[0]] === "undefined") {

                        query_string[pair[0]] = pair[1];

                    } else if (typeof query_string[pair[0]] === "string") {

                        var arr = [ query_string[pair[0]], pair[1] ];
                        query_string[pair[0]] = arr;

                    } else {

                        query_string[pair[0]].push(pair[1]);

                    }

                }

                console.log(query_string[pair[i]]);

            }
            alert("Moods have been saved");
        });

    }

console.log(url);在控制台中生成此输出:

 notes.html?Angelic=&Angry=&Anxious=&Assertive=undefined&Bored=&Confident=&Cranky=&Depressed=&Disappointed=&Distrustful=&Embarassed=&Emotional=&Evil=&Excited=&Exhausted=&Flirtatious=&Forgetful=  

但像Assertive,Evil等表情符号的值并未附加到url。我该如何解决?我认为如果值成功附加到url,那么我可以将paramenters传递给另一个页面。

0 个答案:

没有答案