Question

我有一系列复选框分组到class =＆＃39; year＆＃39;。我想在选中复选框时调用JS中的函数。

html是，

<table class="inner" id="searchTable">
                                         <search>Exam Type:<th>                        
                                                    <?php 
                                                        foreach($exams as $key=>$value):

                                                               echo "<tr><td class='left'><input type='checkbox' class='year' id='$key' name='$key' value='$value'

                                                            if ($category['selected'])
                                                            {
                                                            echo ' checked';
                                                            }

                                                            > $value</td></tr>";
                                                          endforeach; ?>
                                     </table>

此表位于表单内。但是我现在太担心这种形式了。

当选中任何复选框时，JS应该创建一个包含行的表。

function yearTable(){
    var table = document.getElementById("searchYear");
    var row = document.createElement("tr");    
    var cell = document.createElement("td");
    var empty = document.createTextNode("year.value");
    /*var empty = document.createTextNode("");*/
    cell.appendChild(empty);
    row.appendChild(cell);
    table.appendChild(row); 
}

document.getElementByClassName('year').onchange = yearTable;

我尝试过使用.onchange和.clicked但是在选中框时都没有做任何事情。我还需要在JS中检查的值。我尝试了year.value，但那不起作用。我有一个选择选项菜单，其中包含id =＆＃39;考试＆＃39;我能够使用exam.value获得价值，但我无法弄清楚如何为这些复选框做同样的事情。任何帮助将不胜感激。感谢

Answer 1

虽然html文档可能只包含一个具有特定id的元素，但可以有多个具有相同类的元素。

因此，没有document.getElementByClassName这样的功能。有一个函数document.getElementsByClassName，它返回一个元素数组，因此可以调用该函数，然后迭代它的返回值，设置所需的回调。

此外，您发布的代码必须在此行引发异常：

document.getElementByClassName('year')

因此，如果您在Chrome中查看developer tools或在Firefox中查看Firebug，您可能会看到错误。

Answer 2

知道了，

function yearTable(){
    var year = this.value; 

    var table = document.getElementById("searchYear");
    var row = document.createElement("tr"); 
    var cell = document.createElement("td");
    if (this.checked){
       var empty = document.createTextNode(year);
    }
    cell.appendChild(empty);
    row.appendChild(cell);
    table.appendChild(row); 
}

var checkboxes = document.getElementsByClassName('year');
    for(var index in checkboxes){
        checkboxes[index].onchange = yearTable;
    }

由于

.onchange或.onclick和复选框值到JS脚本

2 个答案: