Question

我是网络新手（JSP，java-script等）。我动态创建复选框，然后在它们上应用java脚本。问题是 document.getElementById（..）始终返回null 。我知道这个问题已经多次asked，我尝试了这些解决方案，但不知怎的，它们对我不起作用，可能是我试错了。这是我的代码：

//window.onload = function handleUnusedDieFunctions(checkboxid) {
function handleUnusedDieFunctions(checkboxid) {

    console.log("checkbox id: " + checkboxid);
    var id = checkboxid;
    var chkd = document.getElementById(checkboxid.toString());
    console.log(chkd);
    alert("Just a formality");
    if(chkd.checked) {
       alert("checked");    
    }
    else {
        alert("unchecked");
    }
}

<!-- Some portion of jsp code -->

<div .....
out.println("<table>");
if((die.getFunctionList() != null) && (!die.getFunctionList().isEmpty())){
    functionListForDie = die.getFunctionList();
    ListIterator li11 = functionListForDie.listIterator();
    Function f1;
while (li11.hasNext()) {
f1 = (Function)li11.next();
System.out.println("IC: " + ic.getID() + " Die: " + die.getID() + ", Func: " +
                       f1.getID() + "\n");
out.println("<tr>");
    out.println("<td style='width:30px;'>");
if(unusedIcDieList.size() != 0)
{
    Boolean sameDie = false;
    Boolean sameFunc = false;
    for(IcDie icdie: unusedIcDieList)
    {
    if((icdie.getDieID() == die.getID()))
    {
        sameDie = true;
        System.out.println("icdie.getDieID() == " + icdie.getDieID() + 
                                   " , die.getID() == " + die.getID());
        ArrayList<Integer> unusedFunctionsList = icdie.getUnusedFunctions();
        for(Integer func: unusedFunctionsList)
        {
        System.out.println("Checking func = " + func + ", f1.getID() = " + f1.getID() );
        if(func.intValue() == f1.getID().intValue()) {
            System.out.println("func == " + func + " , f1.getID() == " + f1.getID());                                                                                                       
            sameFunc = true;
         }
    }

}
}
System.out.println("Same Die: " + sameDie.toString() + " , Same Func: " + sameFunc.toString() + "\n");
if(sameDie && sameFunc) {
    String id="test_" + String.valueOf(count);
    System.out.println("Should print unchecked checkbox for id: " + id);
%>
<input type="checkbox" name="unusedfunction" class="standard_checkbox" 
     style="margin: 0px 12px 0px 0px;"  id="'<%=id%>'"           click="handleUnusedDieFunctions('<%=id%>')" ><br>
   <%
}
else {
    String id="test_" + String.valueOf(count);
    System.out.println("Should print checked checkbox for id: " + id);
%>
<input type="checkbox" name="unusedfunction" class="standard_checkbox" style="margin: 0px 12px 0px 0px;" 
    id="'<%=id%>'" onclick="handleUnusedDieFunctions('<%=id%>')" checked="checked" ><br>
<%

}
 }
else
{
%>
<input type="checkbox" name="unusedfunction" class="standard_checkbox" style="margin: 0px 12px 0px 0px;" 
    id="'<%=id%>'" onclick="handleUnusedDieFunctions('<%=id%>')" checked="checked" ><br>
<%
}
count++;

我会看到日志中的文本框ID和第一个警报，但document.getElementById（..）返回null。我尝试在window.load之后放置该函数，但是当我这样做时，我甚至没有得到第一个警报并在控制台上出现这些错误。

TypeError: checkboxid is undefined
var chkd = document.getElementById(checkboxid.toString());

ReferenceError: handleUnusedDieFunctions is not defined
handleUnusedDieFunctions('test_1')

我知道在jsp页面中混合使用java代码不是一个好主意，但是这个代码不是由我编写的，我只需添加一些功能就可以了，但是在某些时候这是必须修复的。

你能说出我做错了吗？

感谢。

Answer 1

请在此语句var chkd = document.getElementById(checkboxid.toString());中删除.toString（），看看您是否能够访问输入标记。或者，您可以尝试使用标记名来访问输入标记，如下所示：document. getElementsByTagName('input')[0]，这样您就可以访问第一个输入标记。

编辑：

对于动态生成的元素，我们可以使用addEventListener。您需要添加的是一个包装器div标签。我更新了jsFiddle：jsfiddle.net/giri_jeedigunta/NG3cP带有包装div标签，请看一下。这适用于所有动态添加的元素。

尽管元素存在，getElementById（）仍返回null

1 个答案: