Question

我使用ColdFusion 8创建搜索表单，并希望用户能够选中一个框，如果他们想要显示高级搜索选项。

这是我到目前为止所做的：

在我的javascript文件中：

function showDiv(advancedVal)
{  
  if(advancedVal == '') {
    $('moreOptions').style.display = "";
  } else {
    $('moreOptions').style.display = "none";
  }
}

在我的CF档案中：

<input name="advanced" type="checkbox" value="" id="advanced" onclick="showDiv('');">


<div id="moreOptions" style="display:none;" class="moreOptions">
<table>
drop down boxes
</table>
</div>

复选框位于不同的表格中，这有关系吗？

任何人都知道为什么这不起作用？

Answer 1

您使用的是jQuery吗？那应该是：

$('moreOptions').style.display = ""应为$('#moreOptions').show()

或

$('moreOptions')[0].style.display = ""

<强> UPD

我想这就是你想要的：

function showDiv(obj) {
    var more = document.getElementById('moreOptions');
    more.style.display = obj.checked ? "" : "none";
}

更改标记：

<input name="advanced" type="checkbox" value="" id="advanced" onchange="showDiv(this)">

请参阅演示http://jsfiddle.net/dfsq/Kexbu/2/

Answer 2

将$('moreOptions')更改为$('#moreOptions')

Answer 3

如果你不使用jQuery，你的代码应该是：

function showDiv(advancedVal)
{  
  if(advancedVal) {
    document.getElementById('moreOptions').style.display = "";
  } else {
    document.getElementById('moreOptions').style.display = "none";
  }
}

和

<input name="advanced" type="checkbox" value="" id="advanced" onchange="showDiv(this.checked)">

以下是一个示例：http://jsfiddle.net/XN8aK/1/

复选框以显示更多选项

3 个答案: