- html - 出于某种原因,IE8 对我的 Sass 文件中继承的 html5 CSS 不友好?
- JMeter 在响应断言中使用 span 标签的问题
- html - 在 :hover and :active? 上具有不同效果的 CSS 动画
- html - 相对于居中的 html 内容固定的 CSS 重复背景?
我正在使用自定义复选框的想法
您可以在其中使用自定义图像来创建自定义复选框。但我无法让复选框消失,只有常规框。示例图片在这里
这是我的代码..
<div id="scheduleContainer">
<table>
<tr>
<!--table header-->
</tr>
<tr>
<td>
<h:selectBooleanCheckbox value="#{schedules[scheduleName][0]}" /><label> 12:00AM</label>
</td>
</div>
在 CSS 中
#scheduleContainer .checkbox {
width: 25px;
height: 20px;
padding: 0px;
background: url(../img/schedule-check.gif) no-repeat;
display: none;
margin: 0px;
border: 1px solid black;
clear: left;
float: left;
}
还给出了 js 文件。我使用正确吗?
/*
CUSTOM CHECK BOXES - Derived from script by Ryan Fait at
http://ryanfait.com/resources/custom-checkboxes-and-radio-buttons/
*/
var checkboxHeight = "20";
/* No need to change anything after this */
document.write('<style type="text/css">.styledGroup input { display: none; } .disabled { opacity: 0.5; filter: alpha(opacity=50); }</style>');
var Custom = {
init: function() {
var inputs = document.getElementsByTagName("input"), span = Array(), textnode, option, active;
for(a = 0; a < inputs.length; a++) {
if(inputs[a].type == "checkbox") {
span[a] = document.createElement("span");
span[a].className = inputs[a].type;
if(inputs[a].checked == true) {
position = "0 -" + (checkboxHeight*2) + "px";
span[a].style.backgroundPosition = position;
}
inputs[a].parentNode.insertBefore(span[a], inputs[a]);
inputs[a].onchange = Custom.clear;
if(!inputs[a].getAttribute("disabled")) {
span[a].onmousedown = Custom.pushed;
span[a].onmouseup = Custom.check;
} else {
span[a].className = span[a].className += " disabled";
}
}
}
document.onmouseup = Custom.clear;
},
pushed: function() {
element = this.nextSibling;
if(element.checked == true && element.type == "checkbox") {
this.style.backgroundPosition = "0 -" + checkboxHeight*3 + "px";
} else if(element.checked != true && element.type == "checkbox") {
this.style.backgroundPosition = "0 -" + checkboxHeight + "px";
}
},
check: function() {
element = this.nextSibling;
if(element.checked == true && element.type == "checkbox") {
this.style.backgroundPosition = "0 0";
element.checked = false;
} else {
if(element.type == "checkbox") {
this.style.backgroundPosition = "0 -" + checkboxHeight*2 + "px";
}
element.checked = true;
}
},
clear: function() {
inputs = document.getElementsByTagName("input");
for(var b = 0; b < inputs.length; b++) {
if(inputs[b].type == "checkbox" && inputs[b].checked == true && inputs[b].className == "styled") {
inputs[b].previousSibling.style.backgroundPosition = "0 -" + checkboxHeight*2 + "px";
} else if(inputs[b].type == "checkbox" && inputs[b].className == "styled") {
inputs[b].previousSibling.style.backgroundPosition = "0 0";
}
}
}
}
window.onload = Custom.init;
最佳答案
只需应用 CSS display: none;
在 <h:selectBooleanCheckbox>
生成的 HTML 上.
例如
<h:selectBooleanCheckbox style="display: none;" />
或
<h:selectBooleanCheckbox styleClass="hide" />
与
.hide {
display: none;
}
关于html - 如何隐藏h :selectBooleanCheckbox,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/7650771/
我有一个,情况:在 JSF 页面中,我有一些 selectBooleanCheckbox。我需要它,当我检查其中一个时,其他一些未选中。我正在努力在 JasperReports 报告中添加或删除列,只
我正在使用自定义复选框的想法 Ryan Fait's Idea 您可以在其中使用自定义图像来创建自定义复选框。但我无法让复选框消失,只有常规框。示例图片在这里 这是我的代码..
我想在 primefaces 的选择/取消选择复选框上显示确认对话框。我试过了 但它不起作用,因为 selectBooleanCheckBox 不可确认。是否有解决此问题的解决方法? 最
我有一个带有复选框的 h:datatable:
我正在开发一个小型单页网络应用程序。在其中,我有一个数据表,其中包含一个 boolean 值列。我想尝试将其显示为复选框。但是它在渲染时失败了。我猜这是因为需要渲染对象并且复选框是 boolean 值
您好,我是 JSF 的新手,遇到了这样的问题。在我的页面上,我有新闻列表,每个新闻都有复选框(我们可以选中此复选框,然后删除选中的新闻)。这很好用。但是删除后我返回到我的页面并按 F5,然后我的应用程
我有一个 JSF 页面,我希望在该页面上有一个复选框,单击该复选框后,将从页面中添加/删除某些其他表单字段。这是我目前用于复选框的(简化)代码: 这是我要隐藏的组件的代码: 1 &
有人可以告诉我如何在组件的值中使用否定说复选框来启用和禁用它吗? 当 bean 中的属性 (somevalue) 的值为 false 时,我必须禁用复选框。 像 对于 bean 属性 boolean
我正在编写 JSF 页面,该页面要求用户单击一个复选框(类似于接受许可协议(protocol))我有以下代码: 我正在设置 required=true,但没有对复选框进行验证。我没有看到任
我有一个 p:selectBooleanCheckbox,它显示一个确认操作的对话框: 更改 p:selectBooleanCheckbox 时,confirmDialog 显示:
我有一个可编辑的数据表 (editMode = "cell")。 编辑自由文本字段和列表框非常简单。但是,我不知道如何编辑复选框字段。更具体地说,当我尝试编辑复选框选择时,输出方面的数据在更改后并未实
我在 ui:repeat 中的多个 DataTable 中使用多个 selectBooleanCheckBox 时遇到一些问题。 类似这样的事情
使用 Trinidad selectBooleanCheckbox 组件如下: 渲染 html 是: X
我正在使用 jDeveloper 12.1.3 和 MAF 2.0.0.0。我正在尝试在移动应用程序中build设置页面。所有项目均基于移动设备上的本地 SQLite 数据库。我已经设置了 POJO(
如何通过选中/取消选中 selectBooleanCheckbox 来重新加载页面(并更新模型值)? @Ellie:我都试过了 和 ,但没有任何反应。 (一段)代码是这样的:
我有 (其中 wai:collectionIter 是自定义标签) 但是相应的html代码看起来像
in Primefaces?
我正在尝试更改 的样式在 像这样的可检查图像 exemple ,我的问题是如何选择正确的 CSS 类来用我的新样式修改 Primefaces 组件的样式,因为在浏览器的 HTML 输出中我发现了许多
我们有每行都有 h:selectBooleanCheckbox 的表格(复选框代表 boolean)。我们希望在更改复选框值(在任何行中)时调用支持 bean 操作。 以下代码的工作方式很有趣:如果
我怎样才能给红色边框? 我试了如下,但是根本没有出现边框。 最佳答案 试试这个, 关于html - 如何设置 h :selectBooleanCheckbox? 的边框样式,我们在Stack Ov
我正在使用 JSF 2 和 Primefaces 4 并遇到以下问题: 我的 XHTML 中有以下代码: Formats
我是一名优秀的程序员,十分优秀!