我的索引页面中有以下代码。
<button id= 'form-show' class= 'btn btn-primary form-btn'> Add Transaction</button
<div class='row'>
<%=render 'form'%>
</div>
以下CoffeeScript:
$('#form-show').click ->
$('#form-section').slideDown()
该按钮应该显示已经加载到DOM中但通过以下方式隐藏的表单部分:
#form-section{
display: none;
}
但是当我点击这个按钮时没有任何反应。表格没有显示出来。我不知道会出现什么问题。这是一件简单的事情。
Add Transaction</button
有些东西不见了......再看一下......关闭>
......
我创建了一个片段。我已经将CoffeeScript转换为javascript,因为编辑器在这里不支持它。一切似乎都有效。
所以我认为以下原因可能是问题所在。
form-section
document
函数上没有加载ready
。因此,请确保您的代码包含在$(document).ready
函数中,如下所示:
$(document).ready(->
$('#form-show').click(->
$("#form-section").slideDown()
)
)
$('#form-show').click(function(){
$('#form-section').slideDown()
})
#form-section{
display: none;
background: #de9a44;
padding: 10px;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.0/jquery.min.js"></script>
<button id='form-show' class= 'btn btn-primary form-btn'> Add Transaction</button
<div class='row'>
<form id="form-section">
<h3>Form</h3>
<input type="text" />
</form>
</div>