Динамическое добавление аттрибута onClick
Здравствуйте!Подскажите, пожалуйста,как кроссбраузерно используя DOM можно изменить аттрибут onClick и чтобы функция могла принимать параметры: например, obj.setAttribute("onclick","play(par1,par2);"); функция начинает сама исполняться ещё до нажатия.а как имея ссылку на объект динамически кроссбраузерно добавить аттрибут onClick с функцией с двумя параметрами, чтобы функция исполнялась только при нажатии?
пробовала делать так: function setEvent(c, name, action) { if (c.addEventListener) { c.addEventListener( name, action, false ); } else if (c.attachEvent) { c.attachEvent("on" + name, action); } else { c["on" + name] = action; } } Соответственно использование: setEvent(obj, "click", function () { play(par1,par2); } ); |
И чем вас ваш вариант не устраивает?
|
не работает почему-то,атрибут onclick не проставляется
|
Цитата:
|
Цитата:
<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8">
</head>
<body>
<button onclick="setEvent(document.getElementById('test'), 'click', function() { someFunc(1,2); });">Повесить функцию на ссылку</button>
<a href="#" id="test">test</a>
<script>
function setEvent(c, name, action)
{
if (c.addEventListener) {
c.addEventListener( name, action, false );
}
else if (c.attachEvent) {
c.attachEvent("on" + name, action);
}
else {
c["on" + name] = action;
}
}
function someFunc(a, b) {
alert(a+','+b);
}
</script>
</body>
</html>
|
М,а если нужно изменить сам атрибут?я клонирую узлы вместе с обработчиком,и мне нужно поменять параметры в функции,если изменять атрибут методом setAttribute,то функция выполняется сразу же,не по нажатию, а способом выше по клику ничего не происходит(
|
Цитата:
В общем что-то типо этого:
<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8">
</head>
<body>
<form>
a: <input type="text" name="a" value="5"><br>
b: <input type="text" name="b" value="3"><br>
<input type="button" value="clone link" onclick="cloneLink(this.form)">
</form>
<a href="#" id="test">test</a><br>
<script>
function setEvent(c, name, action)
{
if (c.addEventListener) {
c.addEventListener( name, action, false );
}
else if (c.attachEvent) {
c.attachEvent("on" + name, action);
}
else {
c["on" + name] = action;
}
}
function someFunc(a, b) {
alert(a + ',' + b);
}
function cloneAndAddHandler(el, a, b) {
var clone = el.cloneNode(true);
setEvent(clone, 'click', function() { someFunc(a, b); });
return clone;
}
function cloneLink(form) {
var el = document.getElementById('test');
var a = form.elements.a.value;
var b = form.elements.b.value;
var newA = cloneAndAddHandler(el, a, b);
newA.innerHTML = 'test' + a + ',' + b;
document.body.appendChild(newA);
document.body.appendChild( document.createElement('br') );
}
</script>
</body>
</html>
|
Цитата:
вот,например,мой кусок кода.я нахожу новый элемент и пытаюсь на него поставить обработчик.у меня бред написан?просто если смотреть через инспектор на моем узле как была функция c параметрами copyTask(0,0),так и осталась.мне нужно изменить на copyTask(0,1).я извиняюсь,что с такими тупыми вопросами,но в js пока что вообще не алё
function addEndRow(dayN,fieldName)
{
var a=document.getElementsByTagName("input");
for (i=0;i<a.length;i++)
{
var obj=a.item(i);
var oname=obj.name;
if (oname==fieldName)
{
obj.value++;
var cop=document.getElementById("cop_"+dayN+"_"+0);
var newCop=cop.cloneNode(true);
newCop.id="cop_"+dayN+"_"+obj.value;
node= newCop.childNodes[1];
node.name="copy_"+dayN+"_"+obj.value;
node.id="copyB_"+dayN+"_"+obj.value;
var myTD=document.createElement('td');
myTD.appendChild(newCop);
var past=document.getElementById("past_"+dayN+"_"+0);
var newPast=past.cloneNode(true);
newPast.id="past_"+dayN+"_"+obj.value;
node2 = newPast.childNodes[1];
node2.name="paste_"+dayN+"_"+obj.value;
node2.id="pasteB_"+dayN+"_"+obj.value;
var myTD2=document.createElement('td');
myTD2.appendChild(newPast);
var cl=document.getElementById("cl_"+dayN+"_"+0);
var newCl=cl.cloneNode(true);
newCl.id="cl_"+dayN+"_"+obj.value;
node3= newCl.childNodes[1];
node3.name="clear_"+dayN+"_"+obj.value;
node3.id="clearB_"+dayN+"_"+obj.value;
var myTD3=document.createElement('td');
myTD3.appendChild(newCl);
var myTR=document.createElement('tr');
myTR.appendChild(myTD);
myTR.appendChild(myTD1);
myTR.appendChild(myTD2);
myTR.appendChild(myTD3);
document.getElementById("myT_"+dayN).appendChild(myTR);
var cp=document.getElementById("copyB_"+dayN+"_"+obj.value);
var ps=document.getElementById("pasteB_"+dayN+"_"+obj.value);
var cl=document.getElementById("clearB_"+dayN+"_"+obj.value);
cp.onclick=function(){copyTask(dayN,obj.value);}
ps.onclick=function(){pasteTask(dayN,obj.value);}
cl.onclick=function(){clearLine(dayN,obj.value);}
}
}
}
|
А node, node2 и node3 так и задумано что они будут из вне браться? И у них уже есть в самом теге атрибут onclick? Или другое навешанный обработчик через addEventListener? Просто по вашему коду получается, что вы пытаетесь для каких-то внешних элементов перезаписать обработчик. Если предыдущий обработчик был записан в атрибуте onclick, то запись свойства .onclick перезапишет его, но атрибут не поменяется т.к. атрибут - это часть HTML кода элемента. Но сама функция будет вызываться при клике уже перезаписанная. Т.е. сам атрибут после перезаписи через .onclick уже ни на что не влияет. Если уж он так смущает, то можете очистить его через setAttribute или вообще удалить c помощью removeAttribute (не работает в старых IE).
В общем, вот тут про атрибуты написано: http://learn.javascript.ru/attribute...трибуты А вот тут про то как вешаются события: http://learn.javascript.ru/introduction-browser-events |
jsnb, спасибо большое за помощь!получилось!оказалос ь, всё просто)
|
| Часовой пояс GMT +3, время: 00:53. |