05.07.2012, 09:52
|
|
Интересующийся
|
|
Регистрация: 13.03.2011
Сообщений: 11
|
|
|
Сообщение от bes
|
|
Такие задачи решаются установкой одного обработчика на родительский контейнер
|
Задача усложняется если не только строки в таблице, но и сами таблицы могут быть динамическими, и появляться в разных местах страницы.
В таком случае нужно привязывать on к body, а это, думаю, затратно. |
|
05.07.2012, 10:08
|
|
Интересующийся
|
|
Регистрация: 13.03.2011
Сообщений: 11
|
|
|
Сообщение от ksa
|
Что именно?
Один вариант клика сработает мгновенно, а другой будет срабатывать через полчаса?
|
Весь вопрос в том, во сколько раз тяжелее метод on |
|
05.07.2012, 11:10
|
 |
Профессор
|
|
Регистрация: 22.03.2012
Сообщений: 3,744
|
|
|
Сообщение от IVAN86
|
Задача усложняется если не только строки в таблице, но и сами таблицы могут быть динамическими, и появляться в разных местах страницы.
В таком случае нужно привязывать on к body, а это, думаю, затратно.
|
Тоже вроде не проблема
<style>
td {border: solid 1px; cursor: pointer}
</style>
<body>
<button id="but">create table</button>
<script>
window.onload = function () {
var str = '<table>';
for (var i = 0; i < 10; i++) {
str += '<tr>';
for (var j = 0; j < 10; j++) {
str += '<td>' + i + j + '</td>';
}
str += '</tr>';
}
str += '</table><br>';
document.body.onclick = function (e) {
e = e || event;
var target = e.target || e.srcElement;
if (target.id == 'but') {
document.body.innerHTML += str;
} else if (target.tagName == 'TD') {
alert(target.innerHTML)
}
}
}
</script>
|
|
05.07.2012, 11:20
|
|
Интересующийся
|
|
Регистрация: 13.03.2011
Сообщений: 11
|
|
|
Сообщение от bes
|
|
Тоже вроде не проблема
|
Интересное решение.
А если в таблице появятся ссылки и input-ы, как быть? |
|
05.07.2012, 11:23
|
 |
CacheVar
|
|
Регистрация: 19.08.2010
Сообщений: 14,121
|
|
|
Сообщение от IVAN86
|
|
Весь вопрос в том, во сколько раз тяжелее метод on
|
Он не тяжелый... 
Никто особо не вспотеет при его использовании. |
|
05.07.2012, 11:25
|
|
Профессор
|
|
Регистрация: 22.03.2012
Сообщений: 3,744
|
|
|
Сообщение от IVAN86
|
|
А если в таблице появятся ссылки и input-ы, как быть?
|
Приведите пример, в котором у вас не получается применить данный метод. |
|
05.07.2012, 11:40
|
|
CacheVar
|
|
Регистрация: 19.08.2010
Сообщений: 14,121
|
|
|
Да это как в анекдоте:
На выпуске агентов по защите авиалиний от терористов...
- Представьте, что вы в лайнере где 500 пассажиров и есть один терорист с бомбой... Ваши действия?
- Я путем тестов, которым обучался, вычислю того терориста и нейтрализую.
- Хорошо... Усложним задачу. У того терориста есть сообщник с еще одной бомбой!
- Так же используя тесты, вычислю обоих... Дождусь пока один отвлечется, устраню другого, а потом и первого.
- Хорошо... А если у терористов будут свои люди в салоне? И у них тоже будут бомбы?
- Я не совсем понимаю... Вы сами-то за кого?
|
|
05.07.2012, 12:28
|
|
Интересующийся
|
|
Регистрация: 13.03.2011
Сообщений: 11
|
|
|
Сообщение от ksa
|
|
На выпуске агентов по защите авиалиний от терористов...
|
 Примерно как в анекдоте.
Но, всё же, я думаю, код не будет работать как надо в этом примере:
|
Код:
|
<style>
td {border: solid 1px; cursor: pointer}
</style>
<body>
<button id="but">create table</button>
<script>
window.onload = function () {
var str = '<table>';
for (var i = 0; i < 10; i++) {
str += '<tr>';
for (var j = 0; j < 10; j++) {
str += '<td><input type="checkbox" /> ' + i + j + '</td>';
}
str += '</tr>';
}
str += '</table><br>';
document.body.onclick = function (e) {
e = e || event;
var target = e.target || e.srcElement;
if (target.id == 'but') {
document.body.innerHTML += str;
} else if (target.tagName == 'TD') {
alert(target.innerHTML)
}
}
}
</script>
|
|
|
05.07.2012, 12:49
|
|
Профессор
|
|
Регистрация: 22.03.2012
Сообщений: 3,744
|
|
<style>
td {border: solid 1px; cursor: pointer}
</style>
<body>
<button id="but">create table</button>
<script>
window.onload = function () {
var str = '<table>';
for (var i = 0; i < 10; i++) {
str += '<tr>';
for (var j = 0; j < 10; j++) {
str += '<td><input type="checkbox" /> ' + i + j + '</td>';
}
str += '</tr>';
}
str += '</table><br>';
document.body.onclick = function (e) {
e = e || event;
var target = e.target || e.srcElement;
if (target.id == 'but') {
document.body.innerHTML += str;
} else if (target.tagName == 'TD') {
alert(target.children[0].checked + '; ' + target.innerText || target.textContent);
//в FF только textContent, в IE только innerText
}
}
}
</script>
Последний раз редактировалось bes, 05.07.2012 в 13:10.
|
|
05.07.2012, 13:18
|
|
Интересующийся
|
|
Регистрация: 13.03.2011
Сообщений: 11
|
|
bes - Хорошее решение!
Я решил эту задачу на JQ таким образом:
$("body").on("click", "tr", function(){ alert(1); })
.on({
"mouseenter": function(){ $("body").off("click", "tr"); },
"mouseleave": function(){ $("body").on("click", "tr", function(){ alert(1); }); },
}, ".tr input, .tr a");
Вопрос на сколько это сильно грузит браузер остаётся открыт.
|
|
|
|
