如何使用AJAX绑定本身取消隐藏具有动态内容的CFDIV？

我有以下用于填充文本输入的CFSELECT标记：

<cfselect id="this" name="this" bind="cfc:Data.getThis()" bindonload="true" />

<cfselect id="that" name="that" bind="cfc:Data.getThat({p1})" />

<cfselect id="theOther" name="theOther" bind="cfc:Data.getTheOther({p1}, {p2})" />

文本输入是需要以以下形式提交的唯一值：

<cfform name="addItem" method="post" action="somepage.cfm">
    <cfinput 
        type="text" 
        id="item" 
        name="item" 
        bind="cfc:Data.getResult({this}, {that}, {theOther})" /><br />

    <cfinput 
        type="submit" 
        name="addButton" 
        value="Add Item" />
</cfform>

我希望表单及其内容只有在三次选择都完成后才可见，并且文本输入有一个值。最好的方法是什么？我假设使用CFDIV是最好的方式，但我不确定如何以这种方式加载动态内容（CFINPUTs）。

函数toggleForm（）{
var a=document.getElementById（“this”）。selectedIndex；
var b=document.getElementById（“that”）。selectedIndex；
var c=document.getElementById（“theOther”）。选择索引；
如果（a>-1&&b>-1&&c>-1）{
document.getElementById（“theForm”）.style.display=“”；
}
}

---

就个人而言，我会通过使用jQuery来简化JS，但我不知道你是否已经在你的网站上使用了jQuery，我不想成为另一个“使用jQuery”的空答案；因此，如果您希望/需要不使用jQuery，那么这应该可以在没有jQuery的情况下使用。（但jQuery太棒了！）

可能需要使用jQuery来满足高级UI需求。。。cfdiv不起作用，因为cfinput必须是cfform。@亨利，你可能是对的。。。这不是一个很大的要求，只是想看看我是否能做到。我能想到的唯一解决办法是，将所有3个值提交给cfdiv，并在该cfdiv中具有最终形式。。。你可以试试，但是。。。我不会。：）哇！这非常简单。我需要试着自己解决这个问题！哈我会尝试一下，然后回来。它很有效。干得好。只需再做一些调整，就可以在我的终端上定制这个。谢谢！

<cfselect id="this" name="this" bind="cfc:Data.getThis()" bindonload="true" onChange="toggleForm();" />
<cfselect id="that" name="that" bind="cfc:Data.getThat({p1})" onChange="toggleForm();" />
<cfselect id="theOther" name="theOther" bind="cfc:Data.getTheOther({p1}, {p2})" onChange="toggleForm();" />

<div id="theForm" style="display:none">
<cfform name="addItem" method="post" action="somepage.cfm">
    <cfinput 
        type="text" 
        id="item" 
        name="item" 
        bind="cfc:Data.getResult({this}, {that}, {theOther})" /><br />

    <cfinput 
        type="submit" 
        name="addButton" 
        value="Add Item" />
</cfform>
</div>

<script type="text/javascript">
    function toggleForm(){
        var a = document.getElementById("this").selectedIndex;
        var b = document.getElementById("that").selectedIndex;
        var c = document.getElementById("theOther").selectedIndex;
        if (a > -1 && b > -1 && c > -1){
            document.getElementById("theForm").style.display = "";
        }
    }
</script>