Fatal编程技术网
  • javascript/
  • Javascript 尝试将JS变量分配给隐藏字段时遇到了问题

Javascript 尝试将JS变量分配给隐藏字段时遇到了问题

javascript html forms

Javascript 尝试将JS变量分配给隐藏字段时遇到了问题,javascript,html,forms,Javascript,Html,Forms,我已经为此奋斗了几天了…需要一些指导 我把一个更大的表格缩减为“样本”大小，以证明我所追求的是什么。 在calcFees函数中，问题区域被封锁在一个非常可识别的区域中 我也试着想象一下，让vars自己贴到表单上，这样就可以看到他们了，但这不起作用 更新：这里有更多关于我遇到什么的信息 //At this point the var regularfee is = 26.5 // (confirmed by console.log(regularfee);) // I want to assign

我已经为此奋斗了几天了…需要一些指导

我把一个更大的表格缩减为“样本”大小，以证明我所追求的是什么。 在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]"
我做错了什么

更新结束*********************************

<!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>


姓名：



会员分类
我想使用贝宝&160 
我想用支票付款
费用
正式会员
全部的


第2页



var PayPals
已选择var检查
var调节费
var memberfee1
var总计
$（函数（）{
函数clearForm（）
{
paypalselected=“0”；
选中选定项=“0”；
正规费用=0.0；
memberfee1=0.0；
总数=0.0；
$（“#regselectedfee”）.text（memberfee1.toFixed（2））；
$（“#total”）.text（total.toFixed（2））；
//清除所有单选按钮
$（“#常规”）.prop（“选中”，假）；
}
函数calcFees（）
{
总数=（1）；
$（“#total”）.text（total.toFixed（2））；
// **********************************************************************************
//这里是我想插入3个JS变量到隐藏字段的地方
//常规费用，regselectedfee，总计
//以下是我尝试过的：
//VAR没有接通电源
//如果可能的话，我希望能够动态地插入vars
//正如用户选择按钮时表单会动态更新一样
document.getElementById（'regularfee'）。value=regularfee；
document.getElementById（'regselectedfee'）。value=regselectedfee；
document.getElementById（'total'）。value=total；
// **********************************************************************************
}
函数selectPayment（）
{
美元（“.pay”）.change（函数（）{
clearForm（）；
如果（$（“#贝宝”）.prop（“选中”））{
正规费用=26.50；
$（“#regularfee”）.text（regularfee.toFixed（2））；
paypalselected=“1”；
选中选定项=“0”；
}
如果（$（“#检查”）.prop（“检查”））{
正规费用=25.0；
$（“#regularfee”）.text（regularfee.toFixed（2））；
选中选定项=“1”；
paypalselected=“0”；
}
});
}
clearForm（）；
选择Payment（）；
//开始成员资格按钮选择
$（“.membership”）.change（函数（）{
如果（已选择=“1”）{
如果（$（“#常规”）.prop（“选中”））{
memberfee1=26.5；
$（“#regselectedfee”）.text（memberfee1.toFixed（2））；
calcFees（）；
} 
}//测试结束
如果（选中==“1”）{
如果（$（“#常规”）.prop（“选中”））{
memberfee1=25.0；
$（“#regselectedfee”）.text（memberfee1.toFixed（2））；
calcFees（）；
} 
}//选中测试结束
})；//结束$（“.membership”）.change（函数（）{
});
//主功能结束
var currentLayer='page1'；
功能显示层（lyr）{
hideLayer（currentLayer）；
document.getElementById（lyr.style.visibility='visible'；
currentLayer=lyr；
滚动到（0,0）；
}
函数隐藏层（lyr）{
document.getElementById（lyr.style.visibility='hidden'；
}
身体{
字体：10pt无衬线；
}
.第页{
位置：绝对位置；
排名前10名；
左:100 ;；
可见性：隐藏；
}
p、 小的
{
线高：5px；
}
p、 smalltext12
{
字号：12px
}
您有两个元素
#total
。只有第一个元素有一个值：

document.getElementById('total').value = total;
其他的也一样

ID必须是唯一的才有用。

您有两个元素
#total
。只有第一个元素有一个值：

document.getElementById('total').value = total;
其他的也一样

ID必须是唯一的才有用。

您有两个元素
#total
。只有第一个元素有一个值：

document.getElementById('total').value = total;
其他的也一样

ID必须是唯一的才有用。

您有两个元素
#total
。只有第一个元素有一个值：

document.getElementById('total').value = total;
其他的也一样

ID必须是唯一的才有用。

从突出显示中可以看出，HTML无效。有什么问题吗？你想要隐藏字段？不想要隐藏字段？找不到JS变量？我不明白。表单内容似乎有效：
0
、
25
或
26.5
总计。这样好吗？变量没有插入到隐藏字段我查看了JSFIDLE…当我单击按钮时，JSFIDLE表单不会为我显示任何值。发布的代码对我有效。我唯一的问题是填充隐藏字段。错误之处在于在两个位置使用相同的id
total
。创建这些id（以及任何其他id）独特的，你应该会有更好的运气。正如你从突出显示中看到的，HTML是无效的。有什么问题吗？你想要隐藏的字段？不想要隐藏的字段？找不到JS变量？我不明白。表单内容似乎起作用：
0
，
25
或
26.5
总计。这样好吗？变量没有插入到隐藏字段我查看了JSFIDLE…当我单击按钮时，JSFIDLE表单不会为我显示任何值。发布的代码对我有效。我唯一的问题是填充隐藏字段。错误之处在于在两个位置使用相同的id
total
。创建这些id（以及任何其他id）独特的，你应该会有更好的运气。正如你从突出显示中看到的，HTML是无效的。有什么问题吗？你想要隐藏的字段？不想要隐藏的字段？找不到JS变量？我不明白。表单内容似乎起作用：
0
，
25
或
26.5
总计。这样好吗？变量没有插入到隐藏字段我查看了JSFIDLE…当我单击按钮时，JSFIDLE表单不会为我显示任何值。发布的代码对我有效。我唯一的问题是