动态创建的按钮无法在IE兼容模式下工作

时间:2012-10-04 13:08:23

标签: javascript jquery html

所以我有大量的div,而我正在做的是当用户将鼠标悬停在div上时显示一个按钮。当用户点击按钮时,它会执行某些操作。目前的问题是,在IE中,当我点击按钮时,按钮就会消失,什么都不做。当它具有兼容模式时,它可以在Chrome FF甚至IE中使用。代码如下。

     function highlightUnmarked ( field ) {
    $( field ).addClass("hover-markedfields");

    var selectedText = $('<div>').append( $( field ).clone() ).html();

    if ( ( selectedText.search( 'triangle-isosceles' ) == -1 )
        && ( selectedText.search( 'triangle-isosceles-blue' ) == -1 )   ) {

        var markButtonsDiv = document.createElement( "div" );
        markButtonsDiv.id = "markButton";

        var initialLink = document.createElement('a');
        initialLink.setAttribute('href', '#');
        initialLink.setAttribute('id', 'initial');
        initialLink.onclick = function() { initial() };

        var initialImg = document.createElement('img');
        initialImg.setAttribute('src', '<?php echo Yii::app()->params['DIRECTORY_NAME'] ?>/images/initial.png');

        initialLink.appendChild( initialImg );

        markButtonsDiv.appendChild( initialLink );

        $(field ).prepend( markButtonsDiv );

    } 

}

调用的函数不执行。我已经将警报作为函数的第一部分并且它没有被调用。最糟糕的是没有错误抛出,所以我似乎无法弄清楚出了什么问题。

以下是被调用函数的代码。它只是抛出一个弹出窗口。

    function initial () {

        $.blockUI({
            message: $('#popup2'),
            centerY: true,
            css: {
                top:  ($(window).height() - 200) /2 + 'px',
                left: ($(window).width() ) /2 + 'px',
                width: '400px',
                height: '',
                margin:'50px 10px',
                padding: '10px 20px 5px 5px',
                color: 'black'
            }
        });
}

感谢您的帮助。

编辑:对不起,伙计,简单的错误是阻止它在FF工作。

1 个答案:

答案 0 :(得分:0)

您的代码是否在IE中无法正常工作?如果您的代码甚至不在Chrome中工作,那么下面是解决方案......

Jquery UI组件与GoogleChrome版本18 +兼容。可能是您的问题。