Как подписаться на событие элемента ?

CVB · №1

Помогите плз. подписаться на событие конкретного элемента.
Я пробовал так:

Код:

function Test() 
{
	alert('text'); 
} 

var inputs = document.getElementsByTagName('input');
for(var k=0;k<inputs.length;k++) 
{
	var input = inputs[k];
	if(input.type == 'text')
	{
		input.onclick = "Test";
	}
}

в консоле нет никаких ошибок но ф-ция Test не вызывается.

И так:

Выделить код

Код:

window.addEventListener("click", OnClickEvent, true);

function OnClickEvent(event)
{
	if (event.originalTarget.nodeName=="input")
		alert(event.originalTarget.nodename);
}

nodename постоянно неизвестно.

Нужно при нажатии на любой элемент изменить у него стиль !

RcT · №2

Нужно что-то типа вот этого?

Выделить код

Код:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
  <head>
    <title>New Document</title>
    <meta http-equiv="content-type" content="text/html; charset=iwindows-1251">
    <script>
	function colorize(a) {
	   //alert(a.parentNode.parentNode);
	   var ch = a.parentNode.parentNode.getAttribute("pus");
	   if (ch == "unchecked") {
	       a.parentNode.parentNode.style.background='#B4D8B4';
		   a.parentNode.parentNode.setAttribute("pus", "checked");
		}
		else {
          a.parentNode.parentNode.style.background='#FFFFFF';
		   a.parentNode.parentNode.setAttribute("pus", "unchecked");
		}
		   
	}
	</script>
  </head>
  <body>
<form action="" method="POST">    <table border="1">
    <tr pus="unchecked"><td><input  onclick="colorize(this);" type="checkbox" name="chk">checkbox</td><td>vfvvfdvfvcf</td></tr>
    </table></form>
  </body>
</html>

CVB · №3

это немного нето

RcT · №4

У меня второой вариант работает ...

Выделить код

Код:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
  <head>
    <title>New Document</title>
    <meta http-equiv="content-type" content="text/html; charset=iwindows-1251">
    <script>
	window.addEventListener("click", OnClickEvent, true);
    function OnClickEvent(event)
    {
      if (event.originalTarget.nodeName == "P")
        alert(event.originalTarget.nodeName);
    }
	</script>
  </head>
  <body>
  <p>dfcdw</p>
  </body>
</html>

CVB · №5

я пишу Extension и мне возвращяет nodename undefined

CVB · №6

ещё если в первом варианте поменять строку

Выделить код

Код:

input.onclick = "Test";
на 
input.onclick = function(){alert(test);};

то вылазиет ошибка:

Ошибка: [Exception... "Component is not available" nsresult: "0x80040111 (NS_ERROR_NOT_AVAILABLE)" location: "JS frame :: chrome://get_html_info/content/get_html_info.js :: SelectElem :: line 86" data: no]

CVB · №7

а HTML-код

Выделить код

Код:

<script>
	function Klik2()
	{
		alert('bbbb');
	}

	function Klik()
	{
		alert('aaaa');
		document.getElementById('aaa').onclick = function(){alert('kkkk');};
	}
</script>
<input id="aaa" type="text"></input>
<input onclick="Klik()" type="button"></input>

работает как надо.
Немогу понять почему !?

RcT · №8

CVB
Мой-то пример работает?
Не знаю что еще сказать, приведенный Вами кусок скрипта отдельно - работает, значит где-то еще что-то
P.S. Кстати у Вас "alert(event.originalTarget.nodename);" хотя надо "alert(event.originalTarget.nodeName);"

CVB · №9

Да действительно надо nodeName.
Но всеже хотелось бы понять почему 1-й вариант не хочет работать(или что там нетак).

Yan · №10

CVB

Выделить код

Код:

<html>
 <head>
  <title>New Document</title>
  <meta http-equiv="content-type" content="text/html; charset=iwindows-1251">
  <script type="text/javascript">
	function Test()
	{
		alert('text'); 
	} 
	function AddListeners(){
		var inputs = document.getElementsByTagName('input');
		for(var k=0;k<inputs.length;k++) 
		{
			var input = inputs[k];
			if(input.type == 'text')
			{
				input.addEventListener("click",Test, true)
			}
		}
	}
	window.addEventListener("load",AddListeners, true);
  </script>
 </head>
 <body>
 <form>
 <input type="text" value="test">
 <br>
 <input type="text" value="test2">
 <br>
 <input type="checkbox">
 </form>
 </body>
</html>

CVB · №11

При использовании вашего кода в Расширении он не работает !

Приведу Кусок кода побольше
файл .XUL

Выделить код

Код:

<?xml version="1.0"?>
<?xml-stylesheet href="chrome://get_html_info/skin/get_html_info.css" type="text/css"?>
<overlay id="get-html-info-overlay" xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul">
<script type="application/x-javascript" src="chrome://get_html_info/content/get_html_info.js"/>
</overlay>

файл .JS

Выделить код

Код:

window.addEventListener("load", ext_onInit, false);
function ext_PDM_onInit() 
{	
	try
	{
		document.addEventListener("DOMContentLoaded", OnDocument, true);		
  	}
	catch (err) 
	{
		alert(err);
		return;
	}
}
function OnDocument(event)
{
	SelectElem(event. originalTarget);
}
function Test() 
{
	alert('text'); 
} 
function SelectElem(doc)
{
	var inputs = doc.getElementsByTagName('input');
	for(var k=0;k<inputs.length;k++) 
	{		
		var input = inputs[k];
		if(input.type == 'text')
		{
			input.addEventListener("click",Test, true);
		}
	}
}

Функция тест не вызывается ! Ошибок в консоле нет.

Yan · №12

CVB

window.addEventListener("load", ext_onInit, false);
function ext_PDM_onInit()

Найдите 4 отличия в выделенных кусках.

P.S. Исправил, проверил - всё работает.

CVB · №13

Это опечатка !
функция называется

function ext_onInit() { ... }

Yan · №14

Единственное, что я сделал - это подправил название функции. И всё заработало.
А если расставить alert'ы, и посмотреть, на какой функции скрипт спотыкается? Например, так:

window.addEventListener("load", ext_onInit, false);
function ext_onInit()
{
alert('ext_onInit');
try
{
document.addEventListener("DOMContentLoaded", OnDocument, true);
}
catch (err)
{
alert(err);
return;
}
}
function OnDocument(event)
{
alert('OnDocument');
SelectElem(event. originalTarget);
}
function Test()
{
alert('text');
}
function SelectElem(doc)
{
alert('SelectElem');
var inputs = doc.getElementsByTagName('input');
for(var k=0;k<inputs.length;k++)
{
var input = inputs[k];
if(input.type == 'text')
{
input.addEventListener("click",Test, true);
alert('check!');
}
}
}

Какие сообщения выведутся, а какие нет?
Быть может, ошибка в структуре расширения?
Или в тестовой странице?

Отредактировано Yan (20-04-2006 12:52:08)

CVB · №15

У меня не выполняется alert('text'); Все остальные alert-ы выполняются !
пробовал на разных страницах

Yan · №16

У меня следующий код везде работает, например, на http://ya.ru/

Выделить код

Код:

window.addEventListener("load", ext_PDM_onInit, false);
function ext_PDM_onInit() 
{    
    try
    {
        document.addEventListener("DOMContentLoaded", OnDocument, true);        
      }
    catch (err) 
    {
        alert(err);
        return;
    }
}
function OnDocument(event)
{
    SelectElem(event. originalTarget);
}
function Test() 
{
    alert('text1'); 
} 
function SelectElem(doc)
{
    var inputs = doc.getElementsByTagName('input');
    for(var k=0;k<inputs.length;k++) 
    {        
        var input = inputs[k];
        if(input.type == 'text')
        {
            input.addEventListener("click",Test, true);
        }
    }
}

При клике на поле поиска выдаёт "text1"...

Отредактировано Yan (20-04-2006 13:08:41)

CVB · №17

блин вот в чем подвох был
я после

input.addEventListener("click",Test, true);

делал (стормозил однако)

var tmp = form.innerHTML;
form.innerHTML = ('<font color="#0000FF">form_' + (j+1) + '; Id: ' + form.id + ' ; Name: ' + form.name + '</font><br>') + tmp;
и вле обьявления терялись

Поменял их местами и все заработало
Большое спасибо за помощь !

CVB · №18

Ещё один вопросик

Выделить код

Код:

добавим код в функцию SelectElem(doc): 

if(input.type == 'submit')
{
	input.style.backgroundColor = ColorGreen;
	input.addEventListener('click', OnSubmitClick, true);
}

и функцию

function OnSubmitClick(event) 
{
}

как можно заблокировать нажатие кнопки "Найти" на www.ya.ru

Выделить код

Код:

event. target. setAttribute ("disabled", "true"); // неподходит

так чтоб onclick кнопке приходил но кроме выполнения function OnSubmitClick(event) больше обработщиков не вызывалось (тоесть поиск бы не начался)

Yan · №19

Поменять type с submit на button?

CVB · №20

Спасибо я уже так и сделал!

Полезная информация