在jQuery中的动态控件上应用css

我如何将CSS样式应用到动态创建的表格元素？ tblResult是我创建的一个动态表。在jQuery中的动态控件上应用css

<script type="text/javascript"> 
    $(document).ready(function() { 
    $('#tblResult tbody tr').on('mouseover', function() { 
    $(this).addClass('highlightRow'); 

    }); 

});

是不是真的，.addClass不会与jQuery中的动态控件一起工作？

想，如果我想补充类子元素：

$('body').on('mouseover', '#tblResult tbody tr td #im', function() { 
    $(this).addClass('transition'); 
    });

那是OK？

来源

2014-03-31 Aj_sari

由于您的表格已被动态添加到DOM，所有事件将不可用于此表格和其中的元素，例如<tr>或<td>。在这种情况下，你需要使用event delegation：

事件代表团允许我们附加一个单一的事件侦听器，到父元素，这将触发对所有选择，那些孩子是否存在匹配的孩子现在或将来添加。

$(document).ready(function() { 
    $('body').on('mouseover','#tblResult tbody tr',function() { 
     $(this).addClass('highlightRow'); 
    }); 
});

所以基本上，事件代表团将帮助你mouseover事件附加到在这种情况下，这些新创建的<tr>元素。

来源

2014-03-31 05:34:14 Felix

但它为什么不适用？ –

事件绑定代码执行tr的时间不存在，并且在添加tr时使用事件委托将绑定事件 – Felix

Thanx用于动态控件的信息！你帮我出去了！ –

为什么不直接在CSS中应用css而不是添加事件？

tr:hover{ 
    background-color: #BADA55; 
}

退房的fiddle

来源

2014-03-31 05:45:28

Ya !!即使我能做到这一点！但是我想使用'on' –

上的动态事件绑定，如果你使用动态事件，你必须做@Felix所说的，你没有分享你的完整html和js，所以我认为tblResult本身是动态添加的。在你的代码片段中，在'document.ready'期间，你试图将事件处理程序连接到一个不存在的DOM对象，这就是为什么@ Felix的回答给了jquery一个'context'，它是'body'，用于jquery观察这个特定的元素 –

在jQuery中的动态控件上应用css

回答

相关问题