Удалить onmousout, когда onmouseclick

У меня есть событие mouseover, чтобы изменить мои строки, я хочу, чтобы выделенный цвет был нажат на строку. Как мне это сделать?Удалить onmousout, когда onmouseclick

<tr onmouseover="this.className=\'highlight\'" onmouseout="this.className=\'normal\'" onclick="showDetails('.$row['id'].')" class="normal">

источник

2011-01-23 Muiter

Не совсем уверен, что вы имеете в виду. Вы хотите сохранить цвет подсветки, когда вы нажали на строку? –

Очень простой пример, существует целый ряд различных способов сделать это.

ПРИМЕЧАНИЕ

Я редактировал пример после оригинального плаката, добавляющий строку разметки. Теперь он более точно соответствует тому, что демонстрирует.

<html> 
<head></head> 
<body> 
<script type="text/javascript"> 

function addHighlight(el) { 
    if (el.className.indexOf('Selected') == -1) { 
     el.className += ' Selected'; 
    } 
} 

function removeHighlight(el) { 
    if (el.className.indexOf('hold') == -1) { 
     el.className = el.className.replace('Selected',''); 
    } 
} 

function setHighlighted(el) { 
    if (el.className.indexOf('hold') == -1) { 
     el.className += ' hold'; 
    } else { 
     el.className = el.className.replace(' hold',''); 
    } 
} 

</script> 
<style type="text/css"> 

tr.Selected td { 
    background-color: #f00; 
} 

</style> 
<table> 
<tbody> 
<tr onClick="setHighlighted(this);" onMouseOver="addHighlight(this);" onMouseOut="removeHighlight(this);"> 
<td>ipsum timor alle re</td> 
<td>ipsum timor alle re</td> 
<td>ipsum timor alle re</td> 
<td>ipsum timor alle re</td> 
</tr> 
<tr onClick="setHighlighted(this);" onMouseOver="addHighlight(this);" onMouseOut="removeHighlight(this);"> 
<td>ipsum timor alle re</td> 
<td>ipsum timor alle re</td> 
<td>ipsum timor alle re</td> 
<td>ipsum timor alle re</td> 
</tr> 
<tr onClick="setHighlighted(this);" onMouseOver="addHighlight(this);" onMouseOut="removeHighlight(this);"> 
<td>ipsum timor alle re</td> 
<td>ipsum timor alle re</td> 
<td>ipsum timor alle re</td> 
<td>ipsum timor alle re</td> 
</tr> 
<tr onClick="setHighlighted(this);" onMouseOver="addHighlight(this);" onMouseOut="removeHighlight(this);"> 
<td>ipsum timor alle re</td> 
<td>ipsum timor alle re</td> 
<td>ipsum timor alle re</td> 
<td>ipsum timor alle re</td> 
</tr> 
</tbody> 
</table> 
</body> 
</html>

источник

2011-01-23 20:14:59

Работает отлично, еще один вопрос, как насчет того, чтобы снова щелкнуть строку, можно ли снова удалить подсветку? – Muiter

Он должен. Вот почему setHighlighted проверяет наличие удержания и добавляет или удаляет его. –

Работает фантастически. Последний вопрос по этой теме. Я попытался заменить класс выделения выделенным, когда событие mouseclicked. Но это не сработает. – Muiter

Это может быть сделано с помощью CSS, например

tr { background:white; } 
tr:hover { background:blue; } 
tr:active { background:red; }

Например

источник

2011-01-23 20:14:40 AlanFoster

Это не учитывает несколько строк, которые могут быть выбраны, или браузеры (IE), которые не поддерживают полностью селекторов css. –

<tr id="mytr_'.$row['id'].'" onmouseover="this.className=\'highlight\'" onmouseout="if(!this.isselected || this.isselected==0){this.className=\'normal\';}" onclick="showDetails('.$row['id'].')" class="normal">

и в функции ShowDetails использовать Еогеасп или время, чтобы сбросить все выбранные строки и после того, как вы все сброса затем положить clickedID.isselected = 1;

источник

2011-01-23 20:15:36 DoubleZero

Вы можете просто удалить onmouseout -Event с this.onmouseout=null в вашем onclick:

<tr ... onclick="this.onmouseout=null; showDetails('.$row['id'].');" ...>

источник

2011-01-23 20:17:21 Floern

Удалить onmousout, когда onmouseclick

ответ

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