Question

我有一个脚本，当点击一个锚标记时会弹出一个div元素

echo '<a href="javascript:void(0);" onclick="popup(\'yme-property-pop\'); loadproperties(\'open\', \''.$row['id'].'\');"><h2>' . $row['placename'] . '</h2></a>';

它来自PHP脚本，在FF和IE（9）中运行良好。但镀铬不会运行它，至少是ver。 18.0.1025.168 m

弹出窗口（divid）;当我单击它时会触发事件，但它会在函数所在的脚本内完成函数调用。

            var width_ratio = 0.4; // If width of the element is 80%, this should be 0.2 so that the element can be centered

    function toggle(div_id) {
        var el = document.getElementById(div_id);
        if ( el.style.display == 'none' ) { el.style.display = 'block';}
        else {el.style.display = 'none';}
    }
    function blanket_size(popUpDivVar) {
                    alert(popUpDivVar);
        if (typeof window.innerWidth != 'undefined') {
            viewportheight = window.innerHeight;
        } else {
            viewportheight = document.documentElement.clientHeight;
        }
        if ((viewportheight > document.body.parentNode.scrollHeight) && (viewportheight > document.body.parentNode.clientHeight)) {
            blanket_height = viewportheight;
        } else {
            if (document.body.parentNode.clientHeight > document.body.parentNode.scrollHeight) {
                blanket_height = document.body.parentNode.clientHeight;
            } else {
                blanket_height = document.body.parentNode.scrollHeight;
            }
        }
        var blanket = document.getElementById('blanket');
        blanket.style.height = blanket_height + 'px';
        var popUpDiv = document.getElementById(popUpDivVar);
        popUpDiv_height=0;
        popUpDiv.style.top = popUpDiv_height + 'px';
    }
    function window_pos(popUpDivVar) {
        if (typeof window.innerWidth != 'undefined') {
            viewportwidth = window.innerHeight;
        } else {
            viewportwidth = document.documentElement.clientHeight;
        }
        if ((viewportwidth > document.body.parentNode.scrollWidth) && (viewportwidth > document.body.parentNode.clientWidth)) {
            window_width = viewportwidth;
        } else {
            if (document.body.parentNode.clientWidth > document.body.parentNode.scrollWidth) {
                window_width = document.body.parentNode.clientWidth;
            } else {
                window_width = document.body.parentNode.scrollWidth;
            }
        }
        var popUpDiv = document.getElementById(popUpDivVar);
        window_width=window_width/2;
        window_width = window_width * width_ratio; 
        popUpDiv.style.left = window_width + 'px';
    }
    function popup(windowname) {
                    alert(windowname); // THIS WORKS
        blanket_size(windowname);
        window_pos(windowname);
        toggle('blanket');
        toggle(windowname);     
    }

该脚本中的最后一个函数是首先调用的函数。我在其中放置一个警告框以验证它是否被触发。但是，我在它调用的下一个函数（blanket_size）中放了一个警告框，它没有触发，因为我在函数的第一行有警告框。它没有发射。

我根本不知道为什么。奇怪的是，这些东西适用于其他浏览器，但不适用于chrome。有什么想法吗？

谢谢！

编辑：我还验证了传递给popup（）函数的参数值（＆＃39; windowname＆＃39; param）是否有效/有值。它包含HTML文档中的DIV的ID，并且它不是动态创建的。

编辑2：好的，当我在弹出（windowname）函数中添加一个带有参数值的警告框（windowname）时，我才能运行该脚本。但如果我删除那个盒子，它就会再次停止工作。

编辑3： 根本没有调试器上的错误。但现在我更加困惑了。经过大量的尝试，似乎它随机地使用警报框！有时工作，有时不工作。

最终修改 将逻辑更改为jQuery。应该早就做完了！

    // Open property
$(".property-open-link", ".yme-propertyitem").live('click', function() { 
    $("#yme-property-pop").css({'display': 'block', 'z-index': '9999' });
    $("#blanket").css({'display': 'block', 'height', getBlanketHeight(), 'z-index': '1000' });
    loadproperties('open', $(this).closest(".yme-propertyitem").attr("id"));
});
// Close property button
$("#yme-property-close").live('click', function() { 
    $("#yme-property-pop").css('display', 'none');
    $("#blanket").css('display', 'none');
});

Answer 1

首先要澄清一些事情：

如果您创建a way for us to interact with your code，尤其是因为您在此处粘贴了PHP代码，而不是简单的 HTML
您有not using a library处理DOM的原因吗？互动？它将使您的代码更简洁，并带走一些跨浏览器代码可能存在的失败点。

右，

我有点不确定您的代码无法在Chrome中运行。我set up a demo in jsfiddle，似乎工作正常。

您会注意到我没有在onclick元素的<a/>属性中附加事件，您也不应该这样做。这可能是问题所在。

目前，jsfiddle中的代码按预期发出警告，但只有在切换时无法找到相关DOM节点时才会失败。

注意：

addEventListener不是跨浏览器，这是使用DOM库的另一个原因。

脚本不会在Google Chrome中调用函数

1 个答案: