سوالف ماتقبل مرفقات بمتداد rar ،
هذه ملف الصفحه سمها اي اسم :
كود:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<html>
<head>
<title>JavaScript Change Class</title>
<meta name="Author" Content="Bit Repository">
<meta name="Keywords" Content="change, class">
<meta name="Description" Content="Change Class">
<link rel="stylesheet" type="text/css" href="style.css" />
<script type="text/javascript" src="functions.js"></script>
</head>
<body>
<div style="width: 900px; text-align: left;" align="center">
<form id="form" name="form">
<table cellspacing="1">
<tr>
<td> </td>
<td> <strong>Title</strong></td>
<td> <strong>Description</strong></td>
</tr>
<tr id="tr1" class="one">
<td><input onClick="JavaScript: highlight('tr1', 'one', this.id);" type="checkbox" id="cb1" name="id[]" value="1"></td>
<td> <label for="cb1">Cras tempor faucibus nunc.</label></td>
<td> Lorem ipsum dolor sit amet, consectetur adipiscing elit.</td>
</tr>
<tr id="tr2" class="two">
<td><input onClick="JavaScript: highlight('tr2', 'two', this.id);" type="checkbox" id="cb2" name="id[]" value="2"></td>
<td> <label for="cb2">Quisque in nunc.</label></td>
<td> Etiam sit amet nibh. Integer sodales lacus ac ligula. </td>
</tr>
<tr id="tr3" class="one">
<td><input onClick="JavaScript: highlight('tr3', 'one', this.id);" type="checkbox" id="cb3" name="id[]" value="3"></td>
<td> <label for="cb3">Aenean commodo tincidunt odio</label></td>
<td> Sed euismod dignissim pede. Aliquam faucibus aliquam urna.</td>
</tr>
<tr id="tr4" class="two">
<td><input onClick="JavaScript: highlight('tr4', 'two', this.id);" type="checkbox" id="cb4" name="id[]" value="4"></td>
<td> <label for="cb4">Cras semper pulvinar quam.</label></td>
<td> Mauris vehicula turpis ac nisl. Nulla facilisi. Maecenas eget enim quis nunc varius sodales. </td>
</tr>
<tr id="tr5" class="one">
<td><input onClick="JavaScript: highlight('tr5', 'one', this.id);" type="checkbox" id="cb5" name="id[]" value="5"></td>
<td> <label for="cb5">Pellentesque in urna.</label></td>
<td> Nam dapibus aliquam tortor. Donec at mi pharetra arcu luctus rutrum. </td>
</tr>
<tr id="tr6" class="two">
<td><input onClick="JavaScript: highlight('tr6', 'two', this.id);" type="checkbox" id="cb6" name="id[]" value="6"></td>
<td> <label for="cb6">Pellentesque vehicula rutrum lectus.</label></td>
<td> Nunc imperdiet tempus erat. Phasellus lacus nisl, molestie blandit, semper a, dictum at, nulla.</td>
</tr>
</table>
</form>
<a href="JavaScript: check_all();">Check</a> / <a href="JavaScript: uncheck_all();">Uncheck</a> All</a>
</div>
</body>
</html>
هذه ملف functions.js
كود:
/* Highlight Row */
function highlight(id, currentClass, checkboxId)
{
var checkbox_element = document.getElementById(checkboxId);
var row_element = document.getElementById(id);
row_element.className = checkbox_element.checked ? 'selected' : currentClass;
}
/* Check All */
function check_all()
{
var num_checkboxes = document.forms[0].elements.length;
for(i = 0; i < num_checkboxes; i++)
{
if(document.forms[0].elements[i].type == 'checkbox')
{
document.forms[0].elements[i].checked = true;
}
}
highlight_all(num_checkboxes);
}
/* Uncheck All */
function uncheck_all()
{
var num_checkboxes = document.forms[0].elements.length;
for(i = 0; i < num_checkboxes; i++)
{
if(document.forms[0].elements[i].type == 'checkbox')
{
document.forms[0].elements[i].checked = false;
}
}
remove_highlight_for_all(num_checkboxes);
}
/* Highlight All Rows (this happens when 'check_all' is triggered */
function highlight_all(num)
{
for(i = 1; i <= num; i++)
{
document.getElementById('tr' + i).className = 'selected';
}
}
/* Remove highlight for all Rows (this happens when 'uncheck_all' is triggered */
function remove_highlight_for_all(num)
{
for(i = 1; i <= num; i++)
{
var initial_class = (i % 2) ? 'one' : 'two';
document.getElementById('tr' + i).className = initial_class;
}
}
وهذه ملف style.css
كود:
HTML, BODY { padding: 0; border: 0px none; }
TABLE { border: 1px solid #cdcdcd; }
FORM { margin: 0px; }
.one { background-color: white; }
.two { background-color: #E6F9E6; }
.selected { background-color: #E0EFF7; }
حطهم بملف وجربه وسلام عليكم