Question

我已经和它斗争了几天了......请需要一些指导。

我已经缩小了一个更大的形式，以“样本”大小来证明我所追求的。有问题的区域在calcFees函数中的一个非常容易识别的区域被阻挡。

我也尝试过想象并让vars自我发布到表单中以便可以看到它们，但这不起作用。

更新：这里有关于我遇到的更多信息。

//At this point the var regularfee is = 26.5
// (confirmed by console.log(regularfee);)
// I want to assign it to the hidden field with the id="regularfee"
// I have tried both of the following lines:
document.getElementById('regularfee').value=regularfee.value;
// console.log(document.getElementById('regularfee.value')); shows "null"
document.getElementById('regularfee').value=regularfee;
// console.log(document.getElementById('regularfee')); shows "[object HTMLDivElement]"

我做错了什么？

END OF UPDATE * ** * ** * ** * ** < EM> * ** * ** * ** * ** * ** < EM> * *

<!DOCTYPE html>
<html>
<head>

</head>
<body>
<form id="multiForm" action="post.php" method="POST" id="app" name="app">
<div id="page1" class="page" style="visibility:visible;">

Name: <input type="text" size="40" name="name1" >
<br><br>

<table border="1" cellpadding="5" width="50%">
<tbody>
<tr>
<td align="center" colspan="3"><strong>Membership Classification</strong></td>
</tr>
<tr><td width="1000">
<input name="paymethod" type="radio" class="pay" id="paypal" value="paypal" />I would like to use PayPal &#160;&#160;
<input name="paymethod" type="radio" class="pay" id="check" value="check" />I would like to pay by check
</td>
<td style="width:150px" align="right">Fee
</td>

<td style="width:150px">

</td></tr>

<tr>
<td><input name="memberclass" type="radio" class="membership" id="regular" value="regular"/>     Regular Membership</td>

<td align="right"><div id=regularfee></td>
<td><div align="right" id=regselectedfee></td>

</tr>
<tr><td colspan="2" align="right">Total </td>
<td><div align="right" id=total>

</td></tr></tbody>
</table>

<input type="hidden" name="regularfee" id="regularfee" value="">
<input type="hidden" name="regselectedfee" id="regselectedfee" value="">
<input type="hidden" name="total" id="total" value="">

</form>
<br>
<input type="button" id="C1" value="Continue" onClick="showLayer('page2')">
</td></tr>
</table>

</div>
<div id="page2" class="page">
<b>Page 2

<br><br>

<input type="button" id="B1" value="Go Back" onClick="showLayer('page1')">
<input type="submit" name="submit" value="Click to see Vars" />

</div>
</form>
</body>
</html>

<script type="text/javascript" src="jquery-1.10.2.min.js"></script>
<script language="JavaScript">

var paypalselected
var checkselected
var regularfee
var memberfee1
var total

$(function () {

function clearForm()
{
     paypalselected = "0";
     checkselected = "0";
     regularfee = 0.0;
     memberfee1 = 0.0;
     total = 0.0;
     $("#regselectedfee").text(memberfee1.toFixed(2));
     $("#total").text(total.toFixed(2));

    // clear all radio buttons

    $("#regular").prop("checked", false );
}

function calcFees()
{
     total = (memberfee1);
     $("#total").text(total.toFixed(2));

// **********************************************************************************
// Here is where I want to plug in the 3 JS vars to the hidden fields
// regularfee, regselectedfee, total
// Here is what I've tried:
// vars are not getting plugged in
// If possible, I would like the vars to be plugged in dynamically 
// just as the form is updateddynamically when user selects buttons

document.getElementById('regularfee').value=regularfee;
document.getElementById('regselectedfee').value=regselectedfee;
document.getElementById('total').value=total;
// **********************************************************************************

}

function selectPayment()
{
    $(".pay").change(function () {
        clearForm();
        if ($("#paypal").prop("checked")) {

            regularfee = 26.50;
            $("#regularfee").text(regularfee.toFixed(2));
            paypalselected = "1";
            checkselected = "0";
         }
       if ($("#check").prop("checked")) {

            regularfee = 25.0;
            $("#regularfee").text(regularfee.toFixed(2));
            checkselected = "1";
            paypalselected = "0";
           }
      });
}

clearForm();

selectPayment();

//start of membership button selection

    $(".membership").change(function () {
     if (paypalselected == "1"){
        if ($("#regular").prop("checked")) {
            memberfee1 = 26.5;
            $("#regselectedfee").text(memberfee1.toFixed(2));
            calcFees();
            } 
         } //end of paypalselected test

      if (checkselected == "1"){
        if ($("#regular").prop("checked")) {
            memberfee1 = 25.0;
            $("#regselectedfee").text(memberfee1.toFixed(2));
            calcFees();
            } 
        } //end of checkselected test

      }); //end of $(".membership").change(function () {

});
//end of main function

var currentLayer = 'page1';
function showLayer(lyr){
    hideLayer(currentLayer);
document.getElementById(lyr).style.visibility = 'visible';
currentLayer = lyr;
window.scrollTo(0,0);
}

function hideLayer(lyr){
document.getElementById(lyr).style.visibility = 'hidden';
}
</script>

<style>
body{
font: 10pt sans-serif;
}
.page{
position: absolute;
top: 10;
left: 100;
visibility: hidden;
}

p.small
{
line-height: 5px;
}

p.smalltext12
{
font-size:12px
}
</style>

Answer 1

您有2个元素#total。只有第一个给出一个值：

document.getElementById('total').value = total;

其他人一样。

ID必须唯一才有用。

试图将JS变量分配给隐藏字段

1 个答案: