为什么此javascript无法使用复选框启用文本框？

Question

再次出现问题实际上，我有以下jsp代码，其中有几个文本框，这些文本框是通过使用属性disable =“ disabled”禁用的。 现在的问题是我将使用迭代器迭代从每个文本框中的数据库获得的每条记录，该迭代器迭代从arraylist中的databse添加的值。如果数据库返回多个记录，则可以使用该复选框启用文本框，但是如果databse结果集仅返回一个记录那么我将无法启用文本框并引发以下错误：消息：'document.f1.chk'为空或不是对象行：26字符：10代码：0

<script type="text/javascript">

function enable()
{
    for(i=0;i<document.preapp.chk.length;i++)
        {
        if(document.preapp.chk[i].checked==true)

            {
            document.preapp.id[i].disabled=false;
            document.preapp.vname[i].disabled=false;
            document.preapp.comp[i].disabled=false;
            document.preapp.cont[i].disabled=false;
            document.preapp.wtm[i].disabled=false;
            document.preapp.intime[i].disabled=false;

            }
        else

            if(document.preapp.chk[i].checked==false)
            {
            document.preapp.id[i].disabled=true;
            document.preapp.vname[i].disabled=true;
            document.preapp.comp[i].disabled=true;
            document.preapp.cont[i].disabled=true;
            document.preapp.wtm[i].disabled=true;
            document.preapp.intime[i].disabled=true;
            }
        }
}


</script>

<CENTER><a href="../vm/form.jsp ">Back to Search</a></CENTER>
<form method="post" action="" name="preapp">

<table border="1" align="center" width="100%">
<%

Iterator itr;
try
{
ArrayList al=(ArrayList)request.getAttribute("sq");
int i=0;
for(itr=al.iterator();itr.hasNext();)
    {
i=i+1;


%>
        <tr>
            <td></td><td><input type="checkbox" name="chk"  onclick="enable(this)" ></td></tr></tr>
            <tr><td>Id</td><td><input type="text" name="id" value="<%=itr.next()%>" disabled="disabled" size="100%"></td></tr>
            <tr><td>Visitor Name</td><td><input type="text" name="vname" value="<%=itr.next()%>" disabled="disabled" size="100%"></td></tr>
            <tr><td>Comapny</td><td><input type="text" name="comp" value="<%=itr.next()%>" disabled="disabled" size="100%"></td></tr>
            <tr><td>Contact</td><td><input type="text" name="cont" value="<%=itr.next()%>" disabled="disabled" size="100%"></td></tr>
            <tr><td>Meeting Scheduled With</td><td><input type="text" name="wtm" value="<%=itr.next()%>" disabled="disabled" size="100%"></td></tr>
            <tr><td>Entry Made On</td><td><input type="text" name="intime" value="<%=itr.next()%>" disabled="disabled" size="100%"></td></tr>
            <tr><td></td>
        </tr>

        <tr>


        </tr>

<%

    }

}
catch(Exception e)
{
e.printStackTrace();
System.out.println(e.getMessage());
}

%>

如何解决这个问题？ 请帮帮我！

Answer 1

它的工作原理类似于魅力，除非您只有一个TR块。

在这种情况下，.chk没有“长度”属性！

您应该单独考虑这种情况：

function enable()
{

    if(document.preapp.chk.length == null)
    {

        disabledState = !document.preapp.chk.checked

        document.preapp.id.disabled=disabledState;
        document.preapp.vname.disabled=disabledState;
        document.preapp.comp.disabled=disabledState;
        document.preapp.cont.disabled=disabledState;
        document.preapp.wtm.disabled=disabledState;
        document.preapp.intime.disabled=disabledState;

    } else {


        for(i=0;i<document.preapp.chk.length;i++)
        {

            disabledState = !document.preapp.chk[i].checked

            document.preapp.id[i].disabled=disabledState;
            document.preapp.vname[i].disabled=disabledState;
            document.preapp.comp[i].disabled=disabledState;
            document.preapp.cont[i].disabled=disabledState;
            document.preapp.wtm[i].disabled=disabledState;
            document.preapp.intime[i].disabled=disabledState;
        }
    }
}

Answer 2

几个建议：不要将元素的属性设置为true或false，请尝试使用setAttribute和removeAttribute方法：

document.preapp.id[i].disabled=true;
//replace with:
document.preapp.id[i].setAttribute('disabled','disabled');
//to enable:
document.preapp.id[i].removeAttribute('disabled');

您做事的方式在99.9％的时间内都能正常工作。 不过，我没有看到上面的代码失败（我对true / false方法有疑问）。

接下来：您发布的错误消息包含非常有用的信息：检查原始代码的第26行。 在您的代码段中找不到“ document.f1.chk”，因此我无法在其中检查错字或其他可能的问题。

您还将元素传递给enable函数。 那么，为什么要遍历所有元素，检查页面上的所有元素呢？

function enable(elem)
{
    var i = document.preapp.indexOf(elem);//
    if (elem.checked === true)
    {
        document.preapp.id[i].removeAttribute('disabled');
        //...
    }
    //functions have properties, exploit them:
    if (typeof enable.previous === 'undefined' || enable.previous === i)
    {
        enable.previous = i;
        return true;
    }
    document.preapp.id[enable.previous].setAttribute('disabled','disabled');
    //...
    enable.previous = i;
}

enable函数的最后一部分存储了刚刚单击的复选框的索引，因此，在以前单击过enable函数时，无需再次遍历所有元素： enable.previous保留了enable.previous的复选框的索引。上次点击。

最后： else块没有打开或关闭括号，并且还有多余的空白行。 否则，不用括号就可以正常工作，但只能分支一行。 在您的代码中，该行为空白：删除else或添加方括号。

PS：也许摆弄些东西有助于清楚了解情况？

---

正如Teejay所指出的，在使用唯一名称的情况下，将直接引用元素，而不是传递nodesList。