2

我使用 pie.js (http://css3pie.com/) 一个允许我在 ie6+ 上使用 css3 的库。我在 document.ready 上应用 pie.js ：

 $(document).ready(function(){
        if (window.PIE) {
            $('.vexClass, #vexId').each(function(){
                PIE.attach(this);
            });
        }

    });

我的问题是，当 dom 被修改时，我应用 pie.js 的元素渲染效果不佳，因此我必须在修改 dom 时加载将 pie.js 应用到我的元素的函数，并且仅适用于使用 OnSubtreeModified 修改的部分或另一种技术...例如，我有一个在加载 dom 时显示的面板，在该面板中，我有一个按钮正在扩展另一个面板，其中包含我想应用 pie.js 的按钮和其他元素，因此对于 main面板我应用了 pie.js 的所有元素都呈现正常，但扩展面板中的元素 pie.js 未应用：| 那么，当为扩展面板修改 dom 时，如何注入该 pie.js 呢？

谢谢。

4

3 回答 3

1

如果您使用 wicket，唯一的方法是通过Wicket.Ajax.registerPostCallHandler 在您的项目中添加这个，每次完成 ajax 请求时，您的饼图都会被应用。

window.document.ready = function() {
    Wicket.Ajax.registerPostCallHandler(pieStarter);
}
function pieStarter() {

    if (window.PIE) {
        go();
    }
}
function go() {
    $(''.vexClass, #vexId'').each(function() {
        PIE.attach(this);
    });
}
于 2012-11-07T11:43:08.657 回答
1

您是否从 Ajax 调用中获取数据？如果是这样，您需要在回调中添加饼图。不可能（至少 afaik）在给定时间没有的东西上添加任何东西。
如果您需要在回调中添加饼图，您应该为此创建一个单独的函数。您可以为该函数提供一个 dom 节点，它会检​​查每个子节点是否应用了 pie，如果没有应用它。

于 2012-11-01T15:04:04.520 回答
1

您不能使用该DOMSubtreeModified事件，因为您所针对的旧版本的 IE 不支持此事件。但是，您可以通过使用此答案Detect changes in the DOM with this script 来解决此问题：

$(document).ready(function () {

    function applyPIE() {
        if (window.PIE) {
            $('.vexClass, #vexId').not('[data-pie=attached]').each(function(){
                PIE.attach(this);
                $(this).attr('data-pie', 'attached');
            });
        }
    }

    onDomChange(function(){ 
        alert('document updated, applying PIE now');
        applyPIE();
    });

    $('#link').click(function () {           
        $('body').append('<h4>added content</h4>');
    });

    applyPIE();

});

它创建了一个本地函数applyPIE()，该函数在文档就绪时调用，并且每次 DOM 更改时都会被调用——过滤掉已处理的元素。您可能希望扩展.vexClass, #vexId选择器集以满足您的需求。

JSFiddle：http: //jsfiddle.net/hongaar/y3FaM/1/

于 2012-11-05T17:42:30.180 回答