ReSQL.ru
     
powered by simpleCommunicator - 2.0.61     © 2026 Programmizd 02
Мобильная версия    Контакт    Правила    FAQ    Помощь
Целевая тема:
Создать новую тему:
Автор:
Закрыть
Цитировать
Доб. в избранное | Игнор. тему | Прикреп. тему | Пометить прочит. / непрочит. | Фильтр
Форумы / HTML, JavaScript, VBScript, CSS [игнор отключен] [закрыт для гостей] / оптимизация обработки событий в таблице . чайнику
25 сообщений из 26, страница 1 из 2
  1  все
оптимизация обработки событий в таблице . чайнику
    #36428030
Fly`
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Fly`
Гость
Уважаемые, здравствуйте. Есть HTML:
Код: plaintext
1.
2.
3.
4.
5.
6.
7.
8.
<tr>
<td id="td1-1" class=empt onmousedown="tdmousedown('td1-1')" onmouseup="tdmouseup('td1-1')" onmouseover="tdmouseover('td1-1')" onmouseout="tdmouseout('td1-1')"></td>
<td id="td1-2" class=empt onmousedown="tdmousedown('td1-2')" onmouseup="tdmouseup('td1-2')" onmouseover="tdmouseover('td1-2')" onmouseout="tdmouseout('td1-2')"></td>
<td id="td1-3" class=empt onmousedown="tdmousedown('td1-3')" onmouseup="tdmouseup('td1-3')" onmouseover="tdmouseover('td1-3')" onmouseout="tdmouseout('td1-3')"></td>
<td id="td1-4" class=empt onmousedown="tdmousedown('td1-4')" onmouseup="tdmouseup('td1-4')" onmouseover="tdmouseover('td1-4')" onmouseout="tdmouseout('td1-4')"></td>
<td id="td1-5" class=empt onmousedown="tdmousedown('td1-5')" onmouseup="tdmouseup('td1-5')" onmouseover="tdmouseover('td1-5')" onmouseout="tdmouseout('td1-5')"></td>
<td id="td1-6" class=empt onmousedown="tdmousedown('td1-6')" onmouseup="tdmouseup('td1-6')" onmouseover="tdmouseover('td1-6')" onmouseout="tdmouseout('td1-6')"></td>
</tr>
И это только одна строка из таблицы, а строк много.
Соответственно хочется, чтоб табличка выглядела так :
Код: plaintext
1.
2.
3.
4.
5.
6.
7.
<tr>
<td id="td1-1" class=empt ></td>
<td id="td1-1" class=empt ></td>
<td id="td1-1" class=empt ></td>
<td id="td1-1" class=empt ></td>
<td id="td1-1" class=empt ></td>
</tr>
но чтоб на нужные события вызывались нужные функции.
Ведь реально же ! Как? Help pls! :-)
Где и какой код нужно вставить в HTML ?
...
Рейтинг: 0 / 0
25.01.2010, 01:39:56
| Ответить | Цитировать | Написать  
оптимизация обработки событий в таблице . чайнику
    #36428166
Фотография krvsa
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
krvsa
Участник
Fly` , используется ли какой-то СервисРэйджес? PHP, JSP, ASP, CSP? Или только "чистый" ХТМЛ?
...
Рейтинг: 0 / 0
25.01.2010, 09:15:25
| Ответить | Цитировать | Написать  
оптимизация обработки событий в таблице . чайнику
    #36428167
Фотография krvsa
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
krvsa
Участник
СервисРэйджес -> СервисПэйджес
----------
Cache for Windows (x86-32) 2007.1.3 (Build 607) Wed Oct 17 2007 02:12:09 EDT
...
Рейтинг: 0 / 0
25.01.2010, 09:15:54
| Ответить | Цитировать | Написать  
оптимизация обработки событий в таблице . чайнику
    #36428345
=jQuery=
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
=jQuery=
Гость
авторГде и какой код нужно вставить в HTML ?
честно скажу - я бы заюзал jQuery
на document.ready найди все все table>tr>td и повесь на них в цикле свои события...
...
Рейтинг: 0 / 0
25.01.2010, 10:45:11
| Ответить | Цитировать | Написать  
оптимизация обработки событий в таблице . чайнику
    #36428357
=jQuery=
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
=jQuery=
Гость
кстати, и классы на них можно так же навесить (про необходимость id - пока незнаю, НО, полагаю что они нужны для этих же js функций - в принципе, можно и их (в таком случае) посрезать)
...
Рейтинг: 0 / 0
25.01.2010, 10:48:34
| Ответить | Цитировать | Написать  
оптимизация обработки событий в таблице . чайнику
    #36429031
Fly`
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Fly`
Гость
krvsa Fly` , используется ли какой-то СервисРэйджес? PHP, JSP, ASP, CSP? Или только "чистый" ХТМЛ?
да. этот HTML генерируется функцией PHP. Но суть в том, что громоздко всё это. есть же принцип у веб-программистов : не смешивать верстку с программингом. Не красиво это :-)
...
Рейтинг: 0 / 0
25.01.2010, 13:59:39
| Ответить | Цитировать | Написать  
оптимизация обработки событий в таблице . чайнику
    #36429084
Fly`
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Fly`
Гость
=jQuery=кстати, и классы на них можно так же навесить (про необходимость id - пока незнаю, НО, полагаю что они нужны для этих же js функций - в принципе, можно и их (в таком случае) посрезать)
Собственно говоря в этом и вопрос. как это сделать ?
Наткнулся на статейку Прогрессивное улучшение в JavaScript , и там в пункте "Привязка функций" есть плохой вариант (как у меня) и хороший (как мне хотелось бы реализовать). Как я вижу для себя хороший:
Код: plaintext
1.
2.
3.
4.
5.
$('td.onmousedown').each(function() {
this.click(function(e) {
tdmousedown($(e.target));
});
});

Но я не пойму где и как его надо вставить.
...
Рейтинг: 0 / 0
25.01.2010, 14:12:13
| Ответить | Цитировать | Написать  
оптимизация обработки событий в таблице . чайнику
    #36429123
Fly`
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Fly`
Гость
Собственно говоря вот она страничка, которую я редактирую :
Тестовая страничка
...
Рейтинг: 0 / 0
25.01.2010, 14:21:16
| Ответить | Цитировать | Написать  
оптимизация обработки событий в таблице . чайнику
    #36429438
Фотография krvsa
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
krvsa
Участник
Fly`есть же принцип у веб-программистов : не смешивать верстку с программингом. Не красиво это :-)
Похоже ты немного исказил "принцип веб-программистов"... Т.е. отделение ХТМЛ-разметки от ее внешнего представления браузерами. Поскольку последнее можно вынести в ЦСС.
А вот "программинг" или указание обработчиков событий никуда не денешь... Можно например свести все к строке вида

Код: plaintext
<td id="td1-1" class=empt onmousedown="tdmousedown()" onmouseup="tdmouseup()" onmouseover="tdmouseover()" onmouseout="tdmouseout()"></td>

поскольку внутри этих функций можно будет использовать ссылку на текущую ячейку (this).

А такая конструкция

Код: plaintext
<td id="td1-1" class='empt' ></td>

поможет только во внешнем представлении ячейки.

Как вариант можно попробовать "заменить" события onmouseover и onmouseout на lbyfvbxtcrbq псевдо класс hover , если ты эти события используешь только для изменения внешнего представления ячеек.

Код: plaintext
1.
2.
3.
4.
5.
6.
7.
8.
9.
10.
11.
12.
13.
14.
15.
16.
17.
18.
19.
20.
21.
22.
23.
24.
25.
26.
<html>
<head>
<title> Попробуем </title> 
<style type='text/css'>
td {
	width: 100px;
	height: 20px;
	border: 1px solid;
}
td:hover {
	background-color: blue;
}
</style>
</head>
<body>
	<table border='0'>
		<tr>
			<td><br />
			</td>
			<td><br />
			</td>
			<td><br />
			</td>
		</tr>
	</table>
</body>
</html>

Правда такое не работает в ИЕ6 например...
...
Рейтинг: 0 / 0
25.01.2010, 15:55:53
| Ответить | Цитировать | Написать  
оптимизация обработки событий в таблице . чайнику
    #36429441
Фотография krvsa
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
krvsa
Участник
lbyfvbxtcrbq псевдо -> это динамический псевдо класс. Не переключился я
----------
Cache for Windows (x86-32) 2007.1.3 (Build 607) Wed Oct 17 2007 02:12:09 EDT
...
Рейтинг: 0 / 0
25.01.2010, 15:57:50
| Ответить | Цитировать | Написать  
оптимизация обработки событий в таблице . чайнику
    #36429446
Фотография krvsa
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
krvsa
Участник
Fly`Собственно говоря вот она страничка, которую я редактирую :
Тестовая страничка
Тогда не понятно зачем тебе события onmouseover и onmouseout?
...
Рейтинг: 0 / 0
25.01.2010, 15:58:28
| Ответить | Цитировать | Написать  
оптимизация обработки событий в таблице . чайнику
    #36429500
Fly`
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Fly`
Гость
krvsa
Тогда не понятно зачем тебе события onmouseover и onmouseout?
на onmouseover я меняю class ячейки, чтобы она отображалась по другому (как выделенная).
на onmouseout я возвращаю исходный класс. чтоб ячейка отображалась как не выделенная.
интерактив жеж :-)
...
Рейтинг: 0 / 0
25.01.2010, 16:15:39
| Ответить | Цитировать | Написать  
оптимизация обработки событий в таблице . чайнику
    #36429536
Фотография krvsa
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
krvsa
Участник
Fly` , вот я вожу курсором по твоему примеру (ссылка выше) - ничего не меняется...
...
Рейтинг: 0 / 0
25.01.2010, 16:24:24
| Ответить | Цитировать | Написать  
оптимизация обработки событий в таблице . чайнику
    #36429553
Fly`
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Fly`
Гость
krvsaКак вариант можно попробовать "заменить" события onmouseover и onmouseout на lbyfvbxtcrbq псевдо класс hover , если ты эти события используешь только для изменения внешнего представления ячеек.
hover действует только на текущую ячейку. Да мне нужно подобие hover только на несколько ячеек сразу.
Как сделать-то ? Просто в тесте мало ячеек. Настоящая таблица (из-за которой сырбор) содержит штук 15 строк и 30-50 колонок в каждой. это 450 тупых строк вида :
Код: plaintext
<td id="td1-1" class=empt onmousedown="tdmousedown()" onmouseup="tdmouseup()" onmouseover="tdmouseover()" onmouseout="tdmouseout()"></td>
Это ж ужасно !!! :)
...
Рейтинг: 0 / 0
25.01.2010, 16:32:20
| Ответить | Цитировать | Написать  
оптимизация обработки событий в таблице . чайнику
    #36429558
Fly`
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Fly`
Гость
krvsa Fly` , вот я вожу курсором по твоему примеру (ссылка выше) - ничего не меняется...
Кааак ??? а на ячейках кликаешь ?
...
Рейтинг: 0 / 0
25.01.2010, 16:33:23
| Ответить | Цитировать | Написать  
оптимизация обработки событий в таблице . чайнику
    #36429580
Фотография krvsa
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
krvsa
Участник
Fly`а на ячейках кликаешь ?
Вона че... А почему можно "выделять" только "горизонтально"? Вертикально не получается...
...
Рейтинг: 0 / 0
25.01.2010, 16:38:53
| Ответить | Цитировать | Написать  
оптимизация обработки событий в таблице . чайнику
    #36429590
Fly`
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Fly`
Гость
krvsaА почему можно "выделять" только "горизонтально"? Вертикально не получается...
Ну задача такая. Выделение происходит в рамках одной строчки.
Так подожжи. Давай вернемся. Как мне все эти события "зашить" в одном месте, чтоб не прописывать миллион раз на каждом элементе ? :-)
...
Рейтинг: 0 / 0
25.01.2010, 16:42:12
| Ответить | Цитировать | Написать  
оптимизация обработки событий в таблице . чайнику
    #36429593
Фотография krvsa
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
krvsa
Участник
Причем если клацнуть где-то в середине, потянуть например вправо, потом на один влево - отметки как небывало. Но если еще потянуть вправо - отметка опять на 2-х ячейках...
Это так задумано?
----------
Cache for Windows (x86-32) 2007.1.3 (Build 607) Wed Oct 17 2007 02:12:09 EDT
...
Рейтинг: 0 / 0
25.01.2010, 16:42:21
| Ответить | Цитировать | Написать  
оптимизация обработки событий в таблице . чайнику
    #36429596
Фотография krvsa
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
krvsa
Участник
Fly`Как мне все эти события "зашить" в одном месте, чтоб не прописывать миллион раз на каждом элементе ? :-)
Если это прям такая надобность, почему конечно я не в курсе... То, как вариант, на onload у <form> или <table> повесить функцию, которая и присвоит обработчикам нужные значения...
Только зачем такие извраты?
...
Рейтинг: 0 / 0
25.01.2010, 16:44:57
| Ответить | Цитировать | Написать  
оптимизация обработки событий в таблице . чайнику
    #36429608
Fly`
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Fly`
Гость
krvsaПричем если клацнуть где-то в середине, потянуть например вправо, потом на один влево - отметки как небывало. Но если еще потянуть вправо - отметка опять на 2-х ячейках...
Это так задумано?

Нет. это баг. Спасибо за тестирование :-) поправил.
Но основной вопрос так до сих пор в силе.
...
Рейтинг: 0 / 0
25.01.2010, 16:46:16
| Ответить | Цитировать | Написать  
оптимизация обработки событий в таблице . чайнику
    #36429647
Фотография krvsa
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
krvsa
Участник
Fly`aНо основной вопрос так до сих пор в силе.
А это разве не решение?

krvsaкак вариант, на onload у <form> или <table> повесить функцию, которая и присвоит обработчикам нужные значения...
Только зачем такие извраты?
...
Рейтинг: 0 / 0
25.01.2010, 16:53:27
| Ответить | Цитировать | Написать  
оптимизация обработки событий в таблице . чайнику
    #36429678
Fly`
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Fly`
Гость
Да, решение. Вот я и бьюсь с написанием этой функции. как не напишу - не работает (
а пишу вот как :
Код: plaintext
1.
2.
3.
4.
5.
6.
7.
8.
<script language="JavaScript">
<!-- //
$('td.empt').each(function() {
	this.mousedown(function(e) {
	tdmousedown($(e.target));
	});
});
//-->
</script>
да. и как к этому обращаться на onLoad тожу не понятно. ведь у функции нету имени..
...
Рейтинг: 0 / 0
25.01.2010, 17:01:25
| Ответить | Цитировать | Написать  
оптимизация обработки событий в таблице . чайнику
    #36430153
Фотография krvsa
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
krvsa
Участник
Fly`Вот я и бьюсь с написанием этой функции. как не напишу - не работает (
А если поиском по форуму пройтись ?
...
Рейтинг: 0 / 0
25.01.2010, 21:03:10
| Ответить | Цитировать | Написать  
оптимизация обработки событий в таблице . чайнику
    #36430155
an0nym
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
an0nym
Участник
krvsaFly`есть же принцип у веб-программистов : не смешивать верстку с программингом. Не красиво это :-)
Похоже ты немного исказил "принцип веб-программистов"... Т.е. отделение ХТМЛ-разметки от ее внешнего представления браузерами. Поскольку последнее можно вынести в ЦСС.
А вот "программинг" или указание обработчиков событий никуда не денешь... Можно например свести все к строке вида
Позволю себе с вами не согласиться. Отделение интерактивного поведения (если, конечно, это не единственно возможное поведение, т. е., например, не страница, которая грузит данные по AJAXу в JSON виде и запихивает в грид) от HTML-разметки - это очень хорошая практика. Но, к сожалению, для новичков это непосильно (не знают они, как много функций на один эвент аттачить), а для матерых лениво и/или иногда невозможно (когда работает шаблонизатор и под твоим контролем код не от <html> до </html>, а многим уже).
...
Рейтинг: 0 / 0
25.01.2010, 21:11:21
| Ответить | Цитировать | Написать  
оптимизация обработки событий в таблице . чайнику
    #36430199
Фотография Ренат
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Ренат
Участник
[quot Fly`]Да, решение. Вот я и бьюсь с написанием этой функции. как не напишу - не работает (
а пишу вот как :
Код: plaintext
1.
2.
3.
4.
5.
<script language="JavaScript">
<!-- //
$('td.empt').hover();
});
//-->
</script>
ВОт пример как должна выглядитьв аща страничка.
Тока обработчик сами вставте верынй.
Код: plaintext
1.
2.
3.
4.
5.
6.
7.
8.
9.
10.
11.
12.
13.
14.
15.
16.
17.
18.
19.
20.
21.
22.
23.
24.
25.
26.
27.
28.
29.
30.
31.
32.
33.
34.
35.
36.
37.
38.
39.
40.
41.
42.
43.
44.
45.
46.
47.
48.
49.
50.
51.
52.
53.
54.
55.
56.
57.
58.
59.
60.
61.
<html>
<title> тестовая страничка </title>
<style>
table {border:1px solid black; border-collapse:collapse;}
.empt {width : 20px; height:20px; border : 1px solid black; }
.mouse {width : 20px; height:20px; border : 1px solid red; }
</style>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js"></script>
<script>
$(document).ready(function () {
	$('.empt').hover(function (){		//при наведении
		$(this).css('backgrond-color','red');
		$(this).addClass('mouse');
	}, function (){		// при отведении
		$(this).css('backgrond-color','lime');
		$(this).addClass('empt');
	});
	$('.empt').mouseup(function (){		// при нажатии мышки
		$(this).css('backgrond-color','blue');
	});
	$('.empt').mousedown(function (){		// при отпускании мышки
		$(this).css('backgrond-color','yellow');
	});
});
</script>


<body>
<h1> Тестирование событий </h1>
<p> Выберите нужный диапазон. Кликните на нужной ячейке в таблице и тащите... </p>
<!--<table id="tb1" onmouseout="tdtableout()"> -->
<table id="tb1" >
<tr>
<!--
-->
<td id="td1-1" class="empt" ></td>
<td id="td1-2" class="empt"></td>
<td id="td1-3" class="empt"></td>
<td id="td1-4" class="empt"></td>
<td id="td1-5" class="empt"></td>
<td id="td1-6" class="empt"></td>
</tr>
<tr>
<td id="td2-1" class="empt"></td>
<td id="td2-2" class="empt"></td>
<td id="td2-3" class="empt"></td>
<td id="td2-4" class="empt"></td>
<td id="td2-5" class="empt"></td>
<td id="td2-6" class="empt"></td>
</tr>
<tr>
<td id="td3-1" class="empt"></td>
<td id="td3-2" class="empt"></td>
<td id="td3-3" class="empt"></td>
<td id="td3-4" class="empt"></td>
<td id="td3-5" class="empt"></td>
<td id="td3-6" class="empt"></td>
</tr>
</table>
<p id="rem"> 123 </p>
<body>
</html>
...
Рейтинг: 0 / 0
25.01.2010, 21:54:08
| Ответить | Цитировать | Написать  
25 сообщений из 26, страница 1 из 2
  1  все
Форумы / HTML, JavaScript, VBScript, CSS [игнор отключен] [закрыт для гостей] / оптимизация обработки событий в таблице . чайнику
Найденые пользователи ...
Разблокировать пользователей ...
Читали тему (0):
Читали форум (0):
Пользователи онлайн (0):
Польз. соглашение   Полит. конфиден.  
NoSQL.ru       Кролег: Проекты, Новости, Чат       РЕД ФОРУМ       Фотоальбом: Участники, Встречи
Закрыть
start [/forum/topic.php?fid=22&msg=36429500&tid=1453621]:
 0ms
get settings:
 9ms
get forum list:
 13ms
check forum access:
 2ms
check topic access:
 2ms
track hit:
 37ms
get topic data:
 10ms
get forum data:
 2ms
get page messages:
 56ms
get tp. blocked users:
 1ms
others: 240ms
total:  372ms
созд. / загр.: 372ms
x
x
Закрыть


Просмотр
0 / 0
Close
Debug Console [Select Text]