Question

我想更改div内的按钮onclick功能。 HTML代码如下所示

<div class="buttons-set" id="payment-buttons-container">
    <button type="button" class="button" onclick="payment.save()" id="payment_button"></button>
</div>

我正在使用以下原型将onlick函数payment.save（）更改为其他内容。

if(payment_method=='gate') {
   var e = $$('div#payment-buttons-container button.button');
   e.setAttribute('onclick','return false;'); // not working
} else {
    var e = $$('div#payment-buttons-container button.button');
    e.setAttribute('onclick','payment.save();'); // not working
}

哪个不起作用并且说“Uncaught TypeError：Object [object HTMLButtonElement]没有方法'setAttribute'”但是当我通过静态获取按钮的id来使用此代码时，它的工作

if(payment_method=='gate') {
    $('payment_button').setAttribute('onclick','return false;');// Works
}
else {
    $('payment_button').setAttribute('onclick','payment.save();');// Works
}

其中“payment_button”是我拍摄的按钮的ID。

Answer 1

问题是$$()返回与CSS选择器匹配的元素列表

如果您只想让第一个元素与选择器

匹配，请尝试此操作

if(payment_method=='gate') {
   var e = $$('div#payment-buttons-container button.button')[0];
   e.setAttribute('onclick','return false;'); // not working
} else {
   var e = $$('div#payment-buttons-container button.button')[0];
   e.setAttribute('onclick','payment.save();'); // not working
}

如果要将它应用于CSS选择器匹配的所有元素，请使用invoke()方法

进行此操作

if(payment_method=='gate') {
   $$('div#payment-buttons-container button.button').invoke('writeAttribute','onclick','return false;');
} else {
    $$('div#payment-buttons-container button.button').invoke('writeAttribute','onclick','payment.save();'); // not working
}

我使用writeAttribute()而不是setAttribute()的原因是writeAttribute()是PrototypeJS方法，并且适用于PrototypeJS支持的所有浏览器，setAttbribute()是标准方法这并不总是可用。

原型setAttribute（）不使用$$（）选择器

1 个答案: