【发布时间】：2015-03-17 05:54:56
【问题描述】：
必须重做 sn-p。我希望它现在可见。这与新代码有关，当您选择一个块时，它们会更改 td 的背景颜色。现在我只需要不改变被点击的颜色。我们又来了。
.active{background-color:red;}<html xmlns:v="urn:schemas-microsoft-com:vml"
xmlns:o="urn:schemas-microsoft-com:office:office"
xmlns:w="urn:schemas-microsoft-com:office:word"
xmlns:m="http://schemas.microsoft.com/office/2004/12/omml"
xmlns="http://www.w3.org/TR/REC-html40">
<head>
<META HTTP-EQUIV="Content-Type" CONTENT="text/html; charset=us-ascii">
<meta name=Generator content="Microsoft Word 12 (filtered medium)">
<link rel="stylesheet" href="FNBStyle.css" type="text/css"
media="screen" title="Stylesheet" />
<!--[if !mso]><style>v\:* {behavior:url(#default#VML);}
o\:* {behavior:url(#default#VML);}
w\:* {behavior:url(#default#VML);}
.shape {behavior:url(#default#VML);}
</style><![endif]-->
<title>Help Desk Survey</title>
<style>
<!-- /* Font Definitions */
@font-face {
font-family: "Cambria Math";
panose-1: 2 4 5 3 5 4 6 3 2 4;
}
@font-face {
font-family: Calibri;
panose-1: 2 15 5 2 2 2 4 3 2 4;
}
@font-face {
font-family: Tahoma;
panose-1: 2 11 6 4 3 5 4 4 2 4;
}
/* Style Definitions */
p.MsoNormal,li.MsoNormal,div.MsoNormal {
margin: 0cm;
margin-bottom: .0001pt;
font-size: 12.0pt;
font-family: "Times New Roman", "serif";
}
a:link,span.MsoHyperlink {
mso-style-priority: 99;
text-decoration: none none;
}
td.TheSelection:hover
{
background:#009999;
}
<!-- begin snippet: js hide: false -->a:visited,span.MsoHyperlinkFollowed {
mso-style-priority: 99;
text-decoration: none none;
}
td.TheSelection:active
{
color:black;
}
td.red-cell {
background: #F00; /* Or some other color */
}
a:hover {
background: #009999;
-webkit-transition: all 1s ease;
-moz-transition: all 1s ease;
-o-transition: all 1s ease;
-ms-transition: all 1s ease;
transition: all 1s ease;
}
p {
mso-style-priority: 99;
mso-margin-top-alt: auto;
margin-right: 0cm;
mso-margin-bottom-alt: auto;
margin-left: 0cm;
font-size: 12.0pt;
font-family: "Times New Roman", "serif";
}
p.MsoAcetate,li.MsoAcetate,div.MsoAcetate {
mso-style-priority: 99;
mso-style-link: "Balloon Text Char";
margin: 0cm;
margin-bottom: .0001pt;
font-size: 8.0pt;
font-family: "Tahoma", "sans-serif";
}
span.BalloonTextChar {
mso-style-name: "Balloon Text Char";
mso-style-priority: 99;
mso-style-link: "Balloon Text";
font-family: "Tahoma", "sans-serif";
}
span.EmailStyle20 {
mso-style-type: personal;
color: black;
}
span.EmailStyle21 {
mso-style-type: personal;
font-family: "Calibri", "sans-serif";
color: #009999;
}
span.EmailStyle22 {
mso-style-type: personal;
font-family: "Calibri", "sans-serif";
color: #009999;
}
span.EmailStyle23 {
mso-style-type: personal;
color: white;
}
span.EmailStyle25 {
mso-style-type: personal-reply;
color: white;
}
.MsoChpDefault {
mso-style-type: export-only;
font-size: 10.0pt;
}
@page WordSection1 {
size: 612.0pt 792.0pt;
margin: 72.0pt 72.0pt 72.0pt 72.0pt;
}
div.WordSection1 {
page: WordSection1;
}
-->
</style>
</head>
<script>
function myHelpFunction()
{
var numbers = [1,2,3,4,5,6,7,8,9,10];
var i;
for(i=1; i< 11; i++)
{
document.getElementById("help_cell" + i).style.backgroundColor = "lightgray";
}
}
function myAgentFunction()
{
var numbers = [1,2,3,4,5,6,7,8,9,10];
var i;
for(i=1; i< 11; i++)
{
document.getElementById("agent_cell" + i).style.backgroundColor = "lightgray";
}
}
</script>
<!-- <script type="text/javascript">
$( function() {
$('td').click( function() {
$(this).toggleClass("red-cell");
} );
} );
</script> -->
<body lang=EN-ZA link=blue vlink=purple
style='margin-top: 5.0pt; margin-bottom: 5.0pt'>
<div id="HeaderContainer">
<div id="Logo"></div>
</div>
<br><br><br><br>
<form wicket:id="formSubmit">
<div class=WordSection1>
<p class=MsoNormal>
<span style='color: white'><o:p> </o:p> </span>
</p>
<div>
<table class=MsoNormalTable border=0 cellspacing=0 cellpadding=0
width=700 style='width: 525.0pt'>
<tr style='height: 15.0pt'>
<td colspan=3 style='padding: 0cm 0cm 0cm 0cm; height: 15.0pt'>
<p class=MsoNormal>
<span
style='font-size: 10.0pt; font-family: "Arial", "serif"; color: #222222'>
<o:p></o:p> </span>
</p></td>
</tr>
<tr>
<td width=20 style='width: 15.0pt; padding: 0cm 0cm 0cm 0cm'>
<p class=MsoNormal>
<span
style='font-size: 10.0pt; font-family: "Arial", "serif"; color: #222222'>
<o:p></o:p> </span>
</p></td>
<td width=660 style='width: 495.0pt; padding: 0cm 0cm 0cm 0cm'>
<p>
<span
style='font-size: 10.0pt; font-family: "Arial", "serif"; color: #222222'>
The Procurement Help Desk strives to deliver the highest level of service, and we would appreciate it if you could rate your most recent interaction with our agent, by selecting the appropriate score below. Your input is critical in helping us service you better. Although optional, it will assist us in understanding the service provided to you if you can provide us with comments and your details.<o:p></o:p> </span>
</p>
<p>
<span
style='font-size: 10.0pt; font-family: "Arial", "serif"; color: #222222'>
<span class="required">*</span> 1. Please rate the service of the FNB Procurement Help Desk<o:p></o:p> </span>
</p>
<div align=center>
<table class=MsoNormalTable border=1 cellpadding=0 width=658
style='width: 493.5pt; background: #F9F9F9; border: solid #009999 1.0pt'>
<tr>
<td style='border: none; padding: 0cm 0cm 0cm 0cm'>
<div align=center>
<table class=MsoNormalTable border=0 cellpadding=0
width="85%" style='width: 85.0%'>
<tr style='height: 114.0pt'>
<td width="40%"
style='width: 40.0%; padding: .75pt .75pt .75pt .75pt; height: 114.0pt'><p
class=MsoNormal align=center style='text-align: center'>
<strong><span
style='font-size: 10.0pt; font-family: "Arial", "serif"; color: #222222'>Not
Likely</span> </strong><span
style='font-size: 10.0pt; font-family: "Arial", "serif"; color: #222222'><br>(Not
good enough) <o:p></o:p> </span>
</p>
<div align=center>
<table class=MsoNormalTable border=0 cellspacing=0
cellpadding=0 width="80%" style='width: 80.0%'>
<tr>
<td width="50%"
style='width: 50.0%; padding: 0cm 0cm 0cm 0cm'><p
class=MsoNormal align=center
style='text-align: center'>
<span
style='font-size: 10.0pt; font-family: "Arial", "serif"; color: #222222'> <o:p></o:p>
</span>
</p>
</td>
<td
style='border: none; border-left: dotted #333333 1.0pt; padding: 0cm 0cm 0cm 0cm'><p
class=MsoNormal align=center
style='text-align: center'>
<span
style='font-size: 10.0pt; font-family: "Arial", "serif"; color: #222222'> <o:p></o:p>
</span>
</p>
</td>
</tr>
<tr>
<td colspan=2
style='border: dotted #333333 1.0pt; border-bottom: none; padding: 0cm 0cm 0cm 0cm'><p
class=MsoNormal align=center
style='text-align: center'>
<span
style='font-size: 10.0pt; font-family: "Arial", "serif"; color: #222222'> <o:p></o:p>
</span>
</p>
</td>
</tr>
</table>
</div>
<p class=MsoNormal align=center style='text-align: center'>
<span
style='font-size: 10.0pt; font-family: "Arial", "serif"; color: #222222; display: none'><o:p> </o:p>
</span>
</p>
<div align=center>
<table class=MsoNormalTable border=0 cellspacing=5 cellpadding=0 width="100%" style='width: 100.0%'>
<tr style='height: 30.0pt'>
<td width=30
style='width: 22.5pt; background: #FF0004; padding: 0cm 0cm 0cm 0cm; height: 30.0pt'
id=help_cell1>
<p class=MsoNormal align=center style='text-align: center'>
<span style='font-size: 10.0pt; font-family: "Arial", "serif"; color: #222222'>
<a href="#" onclick="myHelpFunction()" wicket:id="help_one"><b>
<span style='display:block; font-size: 12.0pt; color: white'>1</span> </b>
</a> <o:p></o:p>
</span>
</p>
</td>
<td width=30
style='width: 22.5pt; background: #FF0004; padding: 0cm 0cm 0cm 0cm; height: 30.0pt'
id=help_cell2><p class=MsoNormal align=center
style='text-align: center'>
<span
style='font-size: 10.0pt; font-family: "Arial", "serif"; color: #222222'><a
href="#" onclick="myHelpFunction()" wicket:id="help_two"><b><span
style='display:block; font-size: 12.0pt; color: white'>2</span> </b>
</a> <o:p></o:p> </span>
</p>
</td>
<td width=30
style='width: 22.5pt; background: #FF0004; padding: 0cm 0cm 0cm 0cm; height: 30.0pt'
id=help_cell3><p class=MsoNormal align=center
style='text-align: center'>
<span
style='font-size: 10.0pt; font-family: "Arial", "serif"; color: #222222'><a
href="#" onclick="myHelpFunction()" wicket:id="help_three"><b><span
style='display:block; font-size: 12.0pt; color: white'>3</span> </b>
</a> <o:p></o:p> </span>
</p>
</td>
<td width=30
style='width: 22.5pt; background: #FF0004; padding: 0cm 0cm 0cm 0cm; height: 30.0pt'
id=help_cell4><p class=MsoNormal align=center
style='text-align: center'>
<span
style='font-size: 10.0pt; font-family: "Arial", "serif"; color: #222222'><a
href="#" onclick="myHelpFunction()" wicket:id="help_four"><b><span
style='display:block; font-size: 12.0pt; color: white'>4</span> </b>
</a> <o:p></o:p> </span>
</p>
</td>
<td width=30
style='width: 22.5pt; background: #FF0004; padding: 0cm 0cm 0cm 0cm; height: 30.0pt'
id=help_cell5><p class=MsoNormal align=center
style='text-align: center'>
<span
style='font-size: 10.0pt; font-family: "Arial", "serif"; color: #222222'><a
href="#" onclick="myHelpFunction()" wicket:id="help_five"><b><span
style='display:block; font-size: 12.0pt; color: white'>5</span> </b>
</a> <o:p></o:p> </span>
</p>
</td>
<td width=30
style='width: 22.5pt; background: #FF0004; padding: 0cm 0cm 0cm 0cm; height: 30.0pt'
id=help_cell6><p class=MsoNormal align=center
style='text-align: center'>
<span
style='font-size: 10.0pt; font-family: "Arial", "serif"; color: #222222'><a
href="#" onclick="myHelpFunction()" wicket:id="help_six"><b><span
style='display:block; font-size: 12.0pt; color: white'>6</span> </b>
</a> <o:p></o:p> </span>
</p>
</td>
</tr>
</table>
</div>
<p class=MsoNormal align=center style='text-align: center'>
<o:p></o:p>
</p>
</td>
<td width="14%"
style='width: 14.0%; padding: .75pt .75pt .75pt .75pt; height: 114.0pt'><p
class=MsoNormal align=center style='text-align: center'>
<strong><span
style='font-size: 10.0pt; font-family: "Arial", "serif"; color: #222222'>Likely</span>
</strong><b><span
style='font-size: 10.0pt; font-family: "Arial", "serif"; color: #222222'><br>
</span> </b><span
style='font-size: 10.0pt; font-family: "Arial", "serif"; color: #222222'>(We
can do better) <o:p></o:p> </span>
</p>
<div align=center>
<table class=MsoNormalTable border=0 cellspacing=0
cellpadding=0 width="50%" style='width: 50.0%'>
<tr>
<td width="50%"
style='width: 50.0%; padding: 0cm 0cm 0cm 0cm'><p
class=MsoNormal align=center
style='text-align: center'>
<span
style='font-size: 10.0pt; font-family: "Arial", "serif"; color: #222222'> <o:p></o:p>
</span>
</p>
</td>
<td
style='border: none; border-left: dotted #333333 1.0pt; padding: 0cm 0cm 0cm 0cm'><p
class=MsoNormal align=center
style='text-align: center'>
<span
style='font-size: 10.0pt; font-family: "Arial", "serif"; color: #222222'> <o:p></o:p>
</span>
</p>
</td>
</tr>
<tr>
<td colspan=2
style='border: dotted #333333 1.0pt; border-bottom: none; padding: 0cm 0cm 0cm 0cm'><p
class=MsoNormal align=center
style='text-align: center'>
<span
style='font-size: 10.0pt; font-family: "Arial", "serif"; color: #222222'> <o:p></o:p>
</span>
</p>
</td>
</tr>
</table>
</div>
<p class=MsoNormal align=center style='text-align: center'>
<span
style='font-size: 10.0pt; font-family: "Arial", "serif"; color: #222222; display: none'><o:p> </o:p>
</span>
</p>
<div align=center>
<table class=MsoNormalTable border=0 cellspacing=5
cellpadding=0 width="100%" style='width: 100.0%'>
<tr style='height: 30.0pt'>
<td width=30
style='width: 22.5pt; background: #FF7F00; padding: 0cm 0cm 0cm 0cm; height: 30.0pt'
id=help_cell7><p class=MsoNormal align=center
style='text-align: center'>
<span
style='font-size: 10.0pt; font-family: "Arial", "serif"; color: #222222'><a
href="#" onclick="myHelpFunction()" wicket:id="help_seven"><b><span
style='display:block; font-size: 12.0pt; color: white'>7</span> </b>
</a> <o:p></o:p> </span>
</p>
</td>
<td width=30
style='width: 22.5pt; background: #FF7F00; padding: 0cm 0cm 0cm 0cm; height: 30.0pt'
id=help_cell8><p class=MsoNormal align=center
style='text-align: center'>
<span
style='font-size: 10.0pt; font-family: "Arial", "serif"; color: #222222'><a
href="#" onclick="myHelpFunction()" wicket:id="help_eight"><b><span
style='display:block; font-size: 12.0pt; color: white'>8</span> </b>
</a> <o:p></o:p> </span>
</p>
</td>
</tr>
</table>
</div>
<p class=MsoNormal align=center style='text-align: center'>
<o:p></o:p>
</p>
</td>
<td width="13%"
style='width: 13.0%; padding: .75pt .75pt .75pt .75pt; height: 114.0pt'><p
class=MsoNormal align=center style='text-align: center'>
<strong><span
style='font-size: 10.0pt; font-family: "Arial", "serif"; color: #222222'>Absolutely</span>
</strong><span
style='font-size: 10.0pt; font-family: "Arial", "serif"; color: #222222'><br>(We
did great) <o:p></o:p> </span>
</p>
<div align=center>
<table class=MsoNormalTable border=0 cellspacing=0
cellpadding=0 width="50%" style='width: 50.0%'>
<tr>
<td width="50%"
style='width: 50.0%; padding: 0cm 0cm 0cm 0cm'><p
class=MsoNormal align=center
style='text-align: center'>
<span
style='font-size: 10.0pt; font-family: "Arial", "serif"; color: #222222'> <o:p></o:p>
</span>
</p>
</td>
<td
style='border: none; border-left: dotted #333333 1.0pt; padding: 0cm 0cm 0cm 0cm'><p
class=MsoNormal align=center
style='text-align: center'>
<span
style='font-size: 10.0pt; font-family: "Arial", "serif"; color: #222222'> <o:p></o:p>
</span>
</p>
</td>
</tr>
<tr>
<td colspan=2
style='border: dotted #333333 1.0pt; border-bottom: none; padding: 0cm 0cm 0cm 0cm'><p
class=MsoNormal align=center
style='text-align: center'>
<span
style='font-size: 10.0pt; font-family: "Arial", "serif"; color: #222222'> <o:p></o:p>
</span>
</p>
</td>
</tr>
</table>
</div>
<p class=MsoNormal align=center style='text-align: center'>
<span
style='font-size: 10.0pt; font-family: "Arial", "serif"; color: #222222; display: none'><o:p> </o:p>
</span>
</p>
<div align=center>
<table class=MsoNormalTable border=0 cellspacing=5
cellpadding=0 width="100%" style='width: 100.0%'>
<tr style='height: 30.0pt'>
<td width=30
style='width: 22.5pt; background: #709F32; padding: 0cm 0cm 0cm 0cm; height: 30.0pt'
id=help_cell9><p class=MsoNormal align=center
style='text-align: center'>
<span
style='font-size: 10.0pt; font-family: "Arial", "serif"; color: #222222'><a
href="#" onclick="myHelpFunction()" wicket:id="help_nine"><b><span
style='display:block; font-size: 12.0pt; color: white'>9</span> </b>
</a> <o:p></o:p> </span>
</p>
</td>
<td width=30
style='width: 22.5pt; background: #709F32; padding: 0cm 0cm 0cm 0cm; height: 30.0pt'
id=help_cell10><p class=MsoNormal align=center
style='text-align: center'>
<span
style='font-size: 10.0pt; font-family: "Arial", "serif"; color: #222222'><a
href="#" onclick="myHelpFunction()" wicket:id="help_ten"><b><span
style='display:block; font-size: 12.0pt; color: white'>10</span>
</b> </a> <o:p></o:p> </span>
</p>
</td>
</tr>
</table>
</div>
<p class=MsoNormal align=center style='text-align: center'>
<o:p></o:p>
</p>
</td>
</tr>
</table>
</div>
</td>
</tr>
</table>
</div>
</td>
<td width=20 style='width: 15.0pt; padding: 0cm 0cm 0cm 0cm'><p
class=MsoNormal>
<span
style='font-size: 10.0pt; font-family: "Arial", "serif"; color: #222222'> <o:p></o:p>
</span>
</p>
</td>
</tr>
<tr>
<td><p></p>
</td>
</tr>
<tr>
<td></td>
<td>
<p>
<span
style='font-size: 10.0pt; font-family: "Arial", "serif"; color: #222222'>
<span class="required">*</span> 2. Please select an agent that assisted you and rate their service.<o:p></o:p> </span>
</p></td></tr>
<tr>
<td style='font-size: 10.0pt; font-family: "Arial", "serif";'></td>
<td><select wicket:id="fromConsultants"></select></td>
</tr>
<tr style='height: 15.0pt'>
<td colspan=3 style='padding: 0cm 0cm 0cm 0cm; height: 15.0pt'>
<p class=MsoNormal>
<span
style='font-size: 10.0pt; font-family: "Arial", "serif"; color: #222222'>
<o:p></o:p> </span>
</p></td>
</tr>
<tr>
<td width=20 style='width: 15.0pt; padding: 0cm 0cm 0cm 0cm'>
<p class=MsoNormal>
<span
style='font-size: 10.0pt; font-family: "Arial", "serif"; color: #222222'>
<o:p></o:p> </span>
</p></td>
<td width=660 style='width: 495.0pt; padding: 0cm 0cm 0cm 0cm'>
</td>
</tr>
</table>
</div>
<p class=MsoNormal>
<o:p> </o:p>
</p>
</div>
<table>
<tr>
<td style='font-size: 10.0pt; font-family: "Arial", "serif";'> Please Enter your details here (Optional)</td>
</tr>
<tr>
<td style='font-size: 10.0pt; font-family: "Arial", "serif";'> Employee Number:</td>
<td><input type="text" wicket:id="empNumber" size="42" /></td>
</tr>
<tr>
<td style='font-size: 10.0pt; font-family: "Arial", "serif";'> Employee Name:</td>
<td><input type="text" wicket:id="empName" size="42" /></td>
</tr>
<tr>
<td style='font-size: 10.0pt; font-family: "Arial", "serif";'> Business Unit:</td>
<td><input type="text" wicket:id="BU" size="42" /></td>
</tr>
</table >
<table >
<tr>
<td style='font-size: 10.0pt; font-family: "Arial", "serif";'> Comment:</td>
</tr>
<tr>
<td> <textarea cols=90 rows=4 wicket:id="comment"></textarea></td>
</tr>
</table>
<table>
<tr>
<td><div wicket:id="feedbackPanel"></div></td>
</tr>
<tr>
<td><input type="submit" value="Submit" id="submit"></td>
</tr>
</table>
</form>
</body>
</html>
【问题讨论】：
-
你能包含一个提琴手或代码片段吗？
-
由于sn-p中的字符，我不得不删除第二个表，它与上面的表完全相同。这是第二个具有我不想刷新的链接的表。 @xzegga
标签： java javascript html wicket