动态创建 JavaScript 函数,它将在 JSP 页面中隐藏和显示 div
Dynamically creating JavaScript function which will hide and display the div in JSP page
我的JSP代码是
<c:forEach var="batchException" items="${batchExceptionType}">
<button> ${batchException.key}</button>
<div id="${batchException.key}">
...
</div>
</c:forEach>
batchExceptionType 是一个映射,它来自 Java 使用 JSTL 的代码。
我想在单击按钮时隐藏和显示 div。
因为创建的 div 数量不固定。所以我不确定如何创建 Java 脚本函数来隐藏和显示此 div
提前致谢。
您也可以使用纯 CSS 解决方案来完成。
通过使用输入复选框及其样式 属性 :checked
。
<label class="button" for="toggle-1">${batchException.key}</label>
<input type="checkbox" id="toggle-1">
<div id="${batchException.key}">
和CSS:
div {
display: none
}
input[type=checkbox]:checked + div {
display: inherit;
}
更好地解释 here。
试试这个
<c:forEach var="batchException" items="${batchExceptionType}">
<button onclick="hideShowDiv(${batchException.key})"> ${batchException.key}</button>
<div id="${batchException.key}">
...
</div>
</c:forEach>
然后在脚本中
<script>
function hideShowDiv(divId){
$(#divId).toggle();
}
</script>
我的JSP代码是
<c:forEach var="batchException" items="${batchExceptionType}">
<button> ${batchException.key}</button>
<div id="${batchException.key}">
...
</div>
</c:forEach>
batchExceptionType 是一个映射,它来自 Java 使用 JSTL 的代码。
我想在单击按钮时隐藏和显示 div。
因为创建的 div 数量不固定。所以我不确定如何创建 Java 脚本函数来隐藏和显示此 div
提前致谢。
您也可以使用纯 CSS 解决方案来完成。
通过使用输入复选框及其样式 属性 :checked
。
<label class="button" for="toggle-1">${batchException.key}</label>
<input type="checkbox" id="toggle-1">
<div id="${batchException.key}">
和CSS:
div {
display: none
}
input[type=checkbox]:checked + div {
display: inherit;
}
更好地解释 here。
试试这个
<c:forEach var="batchException" items="${batchExceptionType}">
<button onclick="hideShowDiv(${batchException.key})"> ${batchException.key}</button>
<div id="${batchException.key}">
...
</div>
</c:forEach>
然后在脚本中
<script>
function hideShowDiv(divId){
$(#divId).toggle();
}
</script>