Javascript选择表中的所有复选框,其中的行具有样式显示标记
我有一个简单的文本过滤器(未显示),它为表中的所有行提供“无”或“表行”的显示属性。我试图让我的“全选”脚本只选中可见的框,但我当前的代码会检查所有内容,而不管可见性如何 如何只检查可见的Javascript选择表中的所有复选框,其中的行具有样式显示标记,javascript,html,Javascript,Html,我有一个简单的文本过滤器(未显示),它为表中的所有行提供“无”或“表行”的显示属性。我试图让我的“全选”脚本只选中可见的框,但我当前的代码会检查所有内容,而不管可见性如何 如何只检查可见的 <html> <head> <script> function checkAll(checktoggle) { var checkboxes = new Array(); checkboxes = document.getE
<html>
<head>
<script>
function checkAll(checktoggle)
{
var checkboxes = new Array();
checkboxes = document.getElementsByTagName('input');
for (var i=0; i<checkboxes.length; i++) {
if (checkboxes[i].type == 'checkbox') {
checkboxes[i].checked = checktoggle;
}
}
}
</script>
</head>
<body>
<table class="sample">
<tbody><tr><td>#</td>
<td>Topic</td>
<td>Number</td>
<td>Checkbox</td></tr>
<tr style="display: table-row;"><td>1</td>
<td>Math</td>
<td>404</td>
<td><input type="checkbox" name="f1" value="1"></td></tr>
<tr style="display: none;"><td>2</td>
<td>Science</td>
<td>1,283</td>
<td><input type="checkbox" name="f2" value="1"></td></tr>
<tr style="display: table-row;"><td>3</td>
<td>Programming</td>
<td>1,465</td>
<td><input type="checkbox" name="f3" value="1"></td></tr>
</table>
<a onclick="javascript:checkAll(true);" href="javascript:void();">check all</a>
<a onclick="javascript:checkAll(false);" href="javascript:void();">uncheck all</a>
</body>
</html>
函数checkAll(checktoggle)
{
var复选框=新数组();
复选框=document.getElementsByTagName('input');
对于(var i=0;i这可能有效:
function checkAll(checktoggle)
{
var checkboxes = new Array();
checkboxes = document.getElementsByTagName('input');
for (var i=0; i<checkboxes.length; i++) {
var cs = window.getComputedStyle(checkboxes[i],"");
if (cs.display != "none" && checkboxes[i].type == 'checkbox') {
checkboxes[i].checked = checktoggle;
}
}
}
函数checkAll(checktoggle)
{
var复选框=新数组();
复选框=document.getElementsByTagName('input');
对于(var i=0;i这可能有效:
function checkAll(checktoggle)
{
var checkboxes = new Array();
checkboxes = document.getElementsByTagName('input');
for (var i=0; i<checkboxes.length; i++) {
var cs = window.getComputedStyle(checkboxes[i],"");
if (cs.display != "none" && checkboxes[i].type == 'checkbox') {
checkboxes[i].checked = checktoggle;
}
}
}
函数checkAll(checktoggle)
{
var复选框=新数组();
复选框=document.getElementsByTagName('input');
对于(var i=0;i在检查之前检查它是否可见
if (checkboxes[i].is(":visible")){
checkboxes[i].checked = checktoggle;
}
此代码将选中“仅可见”复选框。在选中之前检查它是否可见
if (checkboxes[i].is(":visible")){
checkboxes[i].checked = checktoggle;
}
此代码将选中“仅可见”复选框。您可以检查每行的高度。如果高度>0,则该行可见
var trElements = document.getElementsByTagName('tr');
var checkboxes = document.getElementsByTagName('input');
for (var row =1, rowCount = trElements.length -1 ; row < rowCount; row++) {
if (trElements[row].offsetHeight > 0) { // This item is visible
if (checkboxes[i].type == 'checkbox') {
checkboxes[i].checked = checktoggle;
}
}
}
var treelements=document.getElementsByTagName('tr');
var复选框=document.getElementsByTagName('input');
for(var row=1,rowCount=treelements.length-1;row0){//此项可见
如果(复选框[i]。类型=='checkbox'){
复选框[i]。选中=选中切换;
}
}
}
您可以检查每行的高度。如果高度>0,则该行可见
var trElements = document.getElementsByTagName('tr');
var checkboxes = document.getElementsByTagName('input');
for (var row =1, rowCount = trElements.length -1 ; row < rowCount; row++) {
if (trElements[row].offsetHeight > 0) { // This item is visible
if (checkboxes[i].type == 'checkbox') {
checkboxes[i].checked = checktoggle;
}
}
}
var treelements=document.getElementsByTagName('tr');
var复选框=document.getElementsByTagName('input');
for(var row=1,rowCount=treelements.length-1;row0){//此项可见
如果(复选框[i]。类型=='checkbox'){
复选框[i]。选中=选中切换;
}
}
}
您可以使用隐藏的
布尔值:
function checkAll(checktoggle){
var checkboxes = new Array();
checkboxes = document.getElementsByTagName('input');
for (var i=0; i<checkboxes.length; i++) {
if (checkboxes[i].type == 'checkbox') {
if(checkboxes[i].hidden != true){ //Checks if the element is hidden
checkboxes[i].checked = checktoggle;
}
}
}
}
函数checkAll(checktoggle){
var复选框=新数组();
复选框=document.getElementsByTagName('input');
对于(var i=0;i您可以使用隐藏的布尔值:
function checkAll(checktoggle){
var checkboxes = new Array();
checkboxes = document.getElementsByTagName('input');
for (var i=0; i<checkboxes.length; i++) {
if (checkboxes[i].type == 'checkbox') {
if(checkboxes[i].hidden != true){ //Checks if the element is hidden
checkboxes[i].checked = checktoggle;
}
}
}
}
函数checkAll(checktoggle){
var复选框=新数组();
复选框=document.getElementsByTagName('input');
对于(var i=0;i这是将弹出您所需内容的代码
<script>
function checkAll(checktoggle)
{
var checkboxes = new Array();
checkboxes = document.getElementsByTagName('input');
for (var i=0; i<checkboxes.length; i++) {
if (checkboxes[i].type == 'checkbox') {
alert(checkboxes[i].parentNode.parentNode.style.display)
checkboxes[i].checked = checktoggle;
}
}
}
</script>
函数checkAll(checktoggle)
{
var复选框=新数组();
复选框=document.getElementsByTagName('input');
对于(var i=0;i这是将弹出您所需内容的代码
<script>
function checkAll(checktoggle)
{
var checkboxes = new Array();
checkboxes = document.getElementsByTagName('input');
for (var i=0; i<checkboxes.length; i++) {
if (checkboxes[i].type == 'checkbox') {
alert(checkboxes[i].parentNode.parentNode.style.display)
checkboxes[i].checked = checktoggle;
}
}
}
</script>
函数checkAll(checktoggle)
{
var复选框=新数组();
复选框=document.getElementsByTagName('input');
用于(变量i=0;i函数checkAll(检查切换)
{
var tableRows=document.querySelectorAll('tr');
对于(var i=0;i
功能检查全部(检查切换)
{
var tableRows=document.querySelectorAll('tr');
对于(var i=0;i
欢迎访问网站。您的代码有错误。请检查tbody标记。欢迎访问网站。您的代码有错误。请检查tbody标记。