2015-03-04 2 views
0

Я использую Wicket для создания таблицы с несколькими ссылками и различными функциями для каждой ссылки. Теперь, я хочу изменить цвет td при нажатии ссылки. Я пробовал использовать другой код и заканчивал либо с изменением части ссылки, либо с изменением td при щелчке, но тогда ссылка не была нажата.Изменение цвета td при нажатии гиперссылки внутри td

<td width=30 onclick="javascript:this.style.background = '#009999';" style='width: 22.5pt; background: #FF0004; padding: 0cm 0cm 0cm 0cm; height: 30.0pt' id=redcell> 
    <p class=MsoNormal align=center style='text-align: center'> 
     <span style='font-size: 10.0pt; font-family: "Arial", "serif"; color: #222222'> 
      <a href="#" wicket:id="agent_one" value="1" > 
       <b> 
        <span style='display:block; font-size: 12.0pt; color: white' >1</span> 
       </b> 
      </a> 
      <o:p></o:p> 
     </span> 
    </p> 
</td> 
+0

, и я хочу изменить цвет других не связанных ссылок на серый, когда нажимается любая ссылка. – FioLynaly

+0

Возможный дубликат [Как изменить цвет ячейки таблицы HTML по клику] (http://stackoverflow.com/questions/3722465/how-do-i-change-html-table-cell-color-on-click) – badfilms

ответ

0

Вы можете «развернуть» иерархию DOM, используя свойство parentNode. В вашем случае TD является гранд-гранд-родительский элемент связи (с пунктом и пролетом между ними), так что вам нужно, чтобы добавить к вашей ссылке будет что-то вроде этого:

onclick="javascript:this.parentNode.parentNode.parentNode.style.backgroundColor = '#009999';" 

Или в контексте вашего полного кода:

<td width=30 style='width: 22.5pt; background: #FF0004; padding: 0cm 0cm 0cm 0cm; height: 30.0pt' id=redcell> 
<p class=MsoNormal align=center style='text-align: center'> 
<span style='font-size: 10.0pt; font-family: "Arial", "serif"; color: #222222'> 
<a href="#" onclick="javascript:this.parentNode.parentNode.parentNode.style.backgroundColor = '#009999';" wicket:id="agent_one" value="1" ><b><span                   style='display:block; font-size: 12.0pt; color: white' >1</span> </b></a> 
<o:p></o:p> </span> 
</p> 
</td> 
+0

Я уже это пробовал. Но теперь я вижу, что это может быть способ настройки моих таблиц. – FioLynaly

0

попробовать этот

<tr> 
    <td onclick="this.style.backgroundColor = 'Red';">Sample</td> 
    <td onclick="this.style.backgroundColor = 'Blue';">Data</td> 
</tr> 

JSFiddle Demo

+0

Я пробовал это. Я начинаю чувствовать, что проблема основана на том, как я создал свою таблицу. Мне жаль, что я не смогу показать вам, как вы выглядите. Я пробовал свой код на Notepad ++ и запускал его в своем браузере, но работает, но в тот момент, когда я перемещаю его в калитку, мои таблицы остаются прежними. – FioLynaly

Смежные вопросы