Tabelle Außenkörper nur in HTML

Ich möchte nur den äußeren Rand der Tabelle anzeigen, wenn diese Option angeklickt wird. Der Code wird mit extjs und html implementiert. Das Border-Attribut hat 2 Werte 1 und 0, die die Grenzen anzeigen oder ausblenden. Wie kann ich es für die äußeren Grenzen implementieren?Tabelle Außenkörper nur in HTML

Dies ist die Funktion zum Generieren der Tabelle.

generateHtmlTable = function (cols, rows, border) { 
//Create Table 
var tdWidth = 100/cols; 
var classN; 
//break-word only for IE 
//Set the classes for each type of table 
if(border==1){ 
    classN = "table1"; 
} else { 
    classN = "table0"; 
} 
var tempborder = "box"; 
var table = "<table bgColor=white border='"+border+"' width='100%' style=\"table-layout:auto word-wrap: break-word;\" class=\"" + classN +"\" cellpadding=0 cellspacing=0>"; 
for (var i = 0; i< parseInt(rows); i++) { 
    table += "<tr>"; 
    for (var j = 0; j < parseInt(cols); j++) { 
     table += "<td class=\"" + classN +"\" width='" + tdWidth +"%' valign=\"top\">&nbsp;</td>"; 
    } 
    table += "</tr>"; 
} 
table += "</table>"; 
return table;

}

Dies ist die Funktion Grenzen einzustellen.

Quelle

2016-07-20 Anirudh Lakshmeesh

Wenn Sie nur ausblenden Tabellenrand basierend auf Wert anzeigen möchten, kann die Verwendung von jQuery basierend auf Bedingung gelten.

if(border)//is one 
{ 
$(<get table by class or id>).css({border:'1px solid black'}); 
} 
else 
{ 
$(<get table by class or id>).css({border:none}); 
}

function showHideBorder(border) 
 
{ 
 
    if(border == 1) 
 
    { 
 
     $('.isBordered').css({border:'1px solid'}); 
 
    } 
 
    else 
 
    { 
 
     $('.isBordered').css({border:'none'}); 
 
    } 
 
} 
 

 

 
$('#btn1').click(function(){ 
 
    showHideBorder(1); 
 
}); 
 

 
$('#btn2').click(function(){ 
 
    showHideBorder(0); 
 
});

<!DOCTYPE html> 
 
<html> 
 
<head> 
 
    <meta charset="utf-8"> 
 
    <meta name="viewport" content="width=device-width"> 
 
<script src="https://code.jquery.com/jquery-3.0.0.js"></script> 
 
    <title>JS Bin</title> 
 
</head> 
 
<body> 
 
    <table class='isBordered'> 
 
    <tr> 
 
     <td> 
 
     Hello 
 
     </td> 
 
     <td> 
 
     Anirudh Lakshmeesh 
 
     </td> 
 
    </tr> 
 
    <tr> 
 
     <td> 
 
     Hope! 
 
     </td> 
 
     <td> 
 
     It worked 
 
     </td> 
 
    </tr> 
 
    </table> 
 

 
    <button id='btn1'>Show</button> 
 
    <button id='btn2'>Hide</button> 
 
</body> 
 
</html>

Quelle

2016-07-20 10:40:22 jerry

Danke, aber wie nur außerhalb Grenze zeigen? –

Sie meinen, Grenze nur für Tabelle nicht für td/tr ist es? – jerry

Ja, genau. Ich möchte nur Tabellenränder nicht für td und tr. –

Tabelle Außenkörper nur in HTML

Antwort

Verwandte Themen