Question

test1.html

<html>

<head>
    <script type="text/javascript">
function tally()
{
    var scrt_var = 10;


    var Dpoint, Ipoint, Hpoint, Apoint;
    var party_Score = ['Dpoint', 'Ipoint', 'Hpoint', 'Apoint'];
    var D, I, H, A;
    var value_Point;
    var type_Choice;
    var tag_Choice;


    var inputs = document.getElementsByTagName("input"),
        iLength = inputs.length,
    D = I = H = A = 0;

    for (i = 0; i < iLength; i++) if (inputs[i].checked)
    {
        value_Point = parseInt(inputs[i].value);
        if (inputs[i].name.search('D') > -1){ D += value_Point; }
        if (inputs[i].name.search('I') > -1){ I += value_Point; }
        if (inputs[i].name.search('H') > -1){ H += value_Point; }
        if (inputs[i].name.search('A') > -1){ A += value_Point; }
    }
Dpoint = D;
Ipoint = I;
Hpoint = H;
Apoint = A;

location.href = "test3.html?D="+ Dpoint + "&I=" + Ipoint + "&H=" + Hpoint + "&A=" + Apoint;


}
// ]]>
</script>
</head> 

<form method="Get" action="test3.html">
<table>
<tr>
<td>question1</td>
<td><input type="radio" name="D1" value="1"> 1 </td>
<td><input type="radio" name="D1" value="2"> 2 </td>
<td><input type="radio" name="D1" value="3"> 3 </td>
<td><input type="radio" name="D1" value="4"> 4 </td>
<td><input type="radio" name="D1" value="5"> 5 </td>
<td><input type="radio" name="D1" value="6"> 6 </td>
<td><input type="radio" name="D1" value="7"> 7 </td>
<td><input type="radio" name="D1" value="8"> 8 </td>
<td><input type="radio" name="D1" value="9"> 9 </td>
<td><input type="radio" name="D1" value="10"> 10 </td>              
</tr>
<tr>
<td>question2</td>
<td><input type="radio" name="I1" value="1"> 1 </td>
                <td><input type="radio" name="I1" value="2"> 2 </td>
                <td><input type="radio" name="I1" value="3"> 3 </td>
                <td><input type="radio" name="I1" value="4"> 4 </td>
                <td><input type="radio" name="I1" value="5"> 5 </td>
                <td><input type="radio" name="I1" value="6"> 6 </td>
                <td><input type="radio" name="I1" value="7"> 7 </td>
                <td><input type="radio" name="I1" value="8"> 8 </td>
                <td><input type="radio" name="I1" value="9"> 9 </td>
                <td><input type="radio" name="I1" value="10"> 10 </td>
</tr>
<tr>
<td>question3</td>
    <td><input type="radio" name="H1" value="1"> 1 </td>
                <td><input type="radio" name="H1" value="2"> 2 </td>
                <td><input type="radio" name="H1" value="3"> 3 </td>
                <td><input type="radio" name="H1" value="4"> 4 </td>
                <td><input type="radio" name="H1" value="5"> 5 </td>
                <td><input type="radio" name="H1" value="6"> 6 </td>
                <td><input type="radio" name="H1" value="7"> 7 </td>
                <td><input type="radio" name="H1" value="8"> 8 </td>
                <td><input type="radio" name="H1" value="9"> 9 </td>
                <td><input type="radio" name="H1" value="10"> 10 </td>
</tr>
<tr>
                <td><label> question4 </label></td>
                <td><input type="radio" name="A1" value="1"> 1 </td>
                <td><input type="radio" name="A1" value="2"> 2 </td>
                <td><input type="radio" name="A1" value="3"> 3 </td>
                <td><input type="radio" name="A1" value="4"> 4 </td>
                <td><input type="radio" name="A1" value="5"> 5 </td>
                <td><input type="radio" name="A1" value="6"> 6 </td>
                <td><input type="radio" name="A1" value="7"> 7 </td>
                <td><input type="radio" name="A1" value="8"> 8 </td>
                <td><input type="radio" name="A1" value="9"> 9 </td>
                <td><input type="radio" name="A1" value="10"> 10 </td>
        </tr><!-- 14 -->
            <tr>
                <td><label> question5 </label></td>
                <td><input type="radio" name="D2" value="1"> 1 </td>
                <td><input type="radio" name="D2" value="2"> 2 </td>
                <td><input type="radio" name="D2" value="3"> 3 </td>
                <td><input type="radio" name="D2" value="4"> 4 </td>
                <td><input type="radio" name="D2" value="5"> 5 </td>
                <td><input type="radio" name="D2" value="6"> 6 </td>
                <td><input type="radio" name="D2" value="7"> 7 </td>
                <td><input type="radio" name="D2" value="8"> 8 </td>
                <td><input type="radio" name="D2" value="9"> 9 </td>
                <td><input type="radio" name="D2" value="10"> 10 </td>
            </tr><!-- 15 -->
            <tr>
<tr>
<td colspan=2>
<a href="javascript:tally()"> press here</a>
</td>
</tr>
</table>
</form>
</html>

test3.html

<!DOCTYPE html>
<html>
<head>
<script LANGUAGE="JavaScript">
function getParams(){
var idx = document.URL.indexOf('?');
var params = new Array();
if (idx != -1) {
var pairs = document.URL.substring(idx+1, document.URL.length).split('&');
for (var i=0; i<pairs.length; i++){
nameVal = pairs[i].split('=');
params[nameVal[0]] = nameVal[1];
}
}
return params;
}
params = getParams();

D = unescape(params["D"]);
I = unescape(params["I"]);
H = unescape(params["H"]);
A = unescape(params["A"]);

//check here
    alert(D);// the data is passed here i am sure

document.getElementById('Dtag').style.width = D + 'px';
document.getElementById('Itag').style.width = I + 'px';
document.getElementById('Htag').style.width = H + 'px';
document.getElementById('Atag').style.width = A + 'px';

// i cant use the D here to change my style and width , i have the D data but i cant use it

</script>

<style type="text/css">
body {
    font: .8em Calibri, sans-serif;
    margin: auto;
    width: 800px;
}
label {
    display: block;
    float: left;
    width: 100px;
}
br {
    clear: left;
}
.bar {
    background: #999;
    float: left;
    height: 16px;
    margin: 0 0 5px 10px;
    padding: 1px;
    width: 250px;
}
#Dtag, #Itag, #Htag, #Atag{
    background-color: #039;
    height: 16px;
}

</style>

</head>

<body>
<div id="results">
    <h2>Your result: <span id="type"></span></h2>
    <p><big>“ <em id="tagline"></em> ”</big></p>
    <label><strong>fish</strong></label><div class="bar"><div id="Dtag"></div></div><br>
    <label><strong>dog</strong></label><div class="bar"><div id="Itag"></div></div><br>
    <label><strong>cat</strong></label><div class="bar"><div id="Htag"></div></div><br>
    <label><strong>Bug</strong></label><div class="bar"><div id="Atag"></div></div><br>

</body>


</html>

我已成功绕过无线电数据到下一页，但不知何故我不能用它来改变我的风格并使用我在java脚本上的数据，我做错了什么？您可以尝试复制并通过这些代码。

Answer 1

实际上，它不是将数据从一个页面传递到另一个页面的最佳方式，但您可以使其工作。实际上，您的错误是您在创建文档元素之前查询它们。要解决此问题，您可以将脚本移动到页面底部或将其包装成类似

的内容

  document.addEventListener("DOMContentLoaded", function(event) {
    .......
  });

一旦我解码网址，我如何使用数据？

1 个答案: