Question

我有一个带有一些输入复选框的表单。例如：

 <input type="checkbox" name="felhasznal_1" id="felhasznal_1" onclick="felhasznal(this)">
 <input type="checkbox" name="felhasznal_2" id="felhasznal_2" onclick="felhasznal(this)">
 <input type="checkbox" name="felhasznal_3" id="felhasznal_3" onclick="felhasznal(this)">

我对表单隐藏了价值：

<input type="hidden" name="felhasznalas" value="">

我的表单命名如下：

 <form method="post" name="ujpartner_ceg" enctype="multipart/form-data" id="ujpartner_ceg">

我想为felhasznalas的值添加一个蒙面id。但是我有两个具有相同输入的表单，所以这就是我为表单命名的原因，我希望使用表单名称通过getelementByid访问它们。

这是我的javascript（由php生成）：

function felhasznal() {
document.ujpartner_ceges.getElementById('felhasznalas').value = '|x|';

if (document.ujpartner_ceges.getElementById('felhasznal_1').checked) {
document.ujpartner_ceges.getElementById('felhasznalas').value = document.ujpartner_ceges.getElementById('felhasznalas').value + '1|x|';
}
if (document.ujpartner_ceges.getElementById('felhasznal_2').checked) {
document.ujpartner_ceges.getElementById('felhasznalas').value = document.ujpartner_ceges.getElementById('felhasznalas').value + '2|x|';
}
if (document.ujpartner_ceges.getElementById('felhasznal_3').checked) {
document.ujpartner_ceges.getElementById('felhasznalas').value = document.ujpartner_ceges.getElementById('felhasznalas').value + '3|x|';
}
}

我做错了什么？

编辑：我收到此错误： TypeError：document.ujpartner_ceges不是函数。

注意：我有一个名为ujpartner_magan的相同输入的表单！

Answer 1

这可能是一个问题：onclick="felhasznal(this)"

但你的功能没有参数......

function felhasznal() {

为函数添加参数：

function felhasznal(myCheckbox) {

或

从this处理程序中删除onclick。

Answer 2

首先，我会使用document.getElementById而不使用“ujpartner_ceges”。

主要问题是你的输入没有ID，如果你使用的ID与你的功能将按预期工作的名称完全相同。

Answer 3

你的隐藏输入没有ID只是一个名字。

改为使用<input type="hidden" id="felhasznalas" value="">。

对于DOM（页面）而言，ID必须是唯一的，而不仅仅是表单，因此如果您有多个表单，则必须在控件前加上例如：<input type="hidden" id="form1_felhasznalas" value="">。

然后使用document.getElementById而不是document.ujpartner_ceges.getElementById。

我还需要花费几个小时来学习jquery，这是一个非常棒的javascript-cross-browser-framework / helper来做这样的事情:)！

这是一个小提琴：http://jsfiddle.net/3AguQ/ 我已将隐藏的输入更改为文本，因此您可以查看结果...

以下是一些代码：

<script>
  function felhasznal(prefix)
  {
    document.getElementById(prefix + '_felhasznalas').value = '|x|';

    if (document.getElementById(prefix + '_felhasznal_1').checked)
    {
      document.getElementById(prefix + '_felhasznalas').value = document.getElementById(prefix + '_felhasznalas').value + '1|x|';
    }

    if (document.getElementById(prefix + '_felhasznal_2').checked)
    {
      document.getElementById(prefix + '_felhasznalas').value = document.getElementById(prefix + '_felhasznalas').value + '2|x|';
    }

    if (document.getElementById(prefix + '_felhasznal_3').checked)
    {
      document.getElementById(prefix + '_felhasznalas').value = document.getElementById(prefix + '_felhasznalas').value + '3|x|';
    }
  }      
</script>

<form method="post" enctype="multipart/form-data">
   <input type="hidden" id="form1_felhasznalas" value="">
   <input type="checkbox" name="felhasznal_1" id="form1_felhasznal_1" onclick="felhasznal('form1')">
   <input type="checkbox" name="felhasznal_2" id="form1_felhasznal_2" onclick="felhasznal('form1')">
   <input type="checkbox" name="felhasznal_3" id="form1_felhasznal_3" onclick="felhasznal('form1')">
</form>

<form method="post" enctype="multipart/form-data">
   <input type="hidden" id="form2_felhasznalas" value="">
   <input type="checkbox" name="felhasznal_1" id="form2_felhasznal_1" onclick="felhasznal('form2')">
   <input type="checkbox" name="felhasznal_2" id="form2_felhasznal_2" onclick="felhasznal('form2')">
   <input type="checkbox" name="felhasznal_3" id="form2_felhasznal_3" onclick="felhasznal('form2')">
</form>

通过onclick复选框为隐藏值添加值

3 个答案: