Question

通过单击获取DOM元素的值时遇到问题。该元素具有“class”属性集。我的代码看起来像这样。

document.observe('dom:loaded', function() {
   $$('.sepetle').invoke('observe', 'click', function(element){
        var giftDetailID = element.down('input.gldID').getValue();

    });
});

这里我试图通过单击a.sepetle来获取具有类.gldID的输入值。我的输入在'a'元素

中

     <tr id="<?=$row->GLD_ID?>">            
        <td><?=$row->ProdName?></td>
        <td><?=$row->ProdPrice?></td>                                 
        <td>
            <a class="sepetle" onclick="SepeteEkleDayi('<?=$row->ProdID?>');" href="javascript:;">Sepete At</a>
            <input class="gldID" type="hidden" value="<?=$row->GLD_ID?>" />                      
        </td>
     </tr>

Answer 1

down()方法“向下”DOM子链 - 在这个例子中<a>和<input>是兄弟姐妹，所以<input>不会从<a>下来1}}。您可以通过几种方式来解决这个问题，具体取决于您计划放入这些表格单元格的其他内容。

如果它只是<a>和<input>，那么这将起作用

document.observe('dom:loaded', function() {
   $$('.sepetle').invoke('observe', 'click', function(element){
        var giftDetailID = element.siblings()[0].getValue();
    });
});

否则我会这样做更灵活

document.observe('dom:loaded', function() {
   $$('.sepetle').invoke('observe', 'click', function(element){
        var giftDetailID = element.up('td').down('input.gldID').getValue();

    });
});

Answer 2

这里也有next()可能有用。如果您使用1.7，还需要on()功能。（使用on的关键是你只为整个页面创建一个监听器，而不是每个元素一个监听器。）

document.on('click', '.sepetle', function(evt, elm){
  evt.stop();
  var giftDetailId = $F(elm.next('input'));

});

Event.stop（evt）将阻止点击发生，因此您无需在HTML中使用javascript:;个网址。提供将复制JS输出的实际URL，而不是这些不可抓取的伪URL，这是更好的形式。（当然，除非你正在做一些破坏点击的东西，比如DELETE。）

你也不需要on()的document.observe（'dom：loaded'）包装器 - 另一个胜利！

点击和元素时输入到var的原型getValue

2 个答案: