javascript - onResize()在WordPress 4.7.2中不起作用

我正在尝试显示浏览器窗口的宽度onResize（）。我已经阅读了很多有关它的文章，但仍然无法正常工作。 JavaScript永远不会运行（警报永远不会显示）。

这种使用onResize =“ dispScreenWidth（）”的方法在Bootstrap站点中可以正常工作。我知道get_template_directory_uri（）路径是正确的。我刚刚安装了jQuery更新器，但这没有帮助。

functions.php
<?php
    function flashdatadesign_twentytwelve_credits() {
        echo 'Website by <a href="http://example.com" title="example">';
    }
    add_action( 'twentytwelve_credits', 'mysite_twentytwelve_credits');

    wp_enqueue_script( 'bcscript', get_template_directory_uri().'/js/bcscript.js', array ( 'jquery' ), NULL, true );
?>

header.php
<body <?php body_class(); ?> onResize="dispScreenWidth()">
    <div id="page" class="hfeed site">
        <p id="diag"></p> // --- this is just to display window.innerWidth
        <header id="masthead" class="site-header" role="banner">
        <hgroup>
       ...........
</body>

bcscript.js
jQuery(document).ready(function(){
    function dispScreenWidth() {
        jQuery('#diag').css('display', 'inline');
        jQuery('#diag').html('');
        jQuery('#diag').append(window.innerWidth + ', ');

        alert('display');
    }
});

最佳答案

您的功能超出范围。

您在另一个函数中声明了dispScreenWidth()函数，因此当您使用onResize调用该函数时，该函数不可用。

尝试将其从jQuery（document）.ready范围中删除，并将其放在主范围中。

像这样：

jQuery(document).ready(function(){
    //do other stuff
});

function dispScreenWidth() {
    jQuery('#diag').css('display', 'inline');
    jQuery('#diag').html('');
    jQuery('#diag').append(window.innerWidth + ', ');

    alert('display');
}

另外，您可以使用与onResize等效的jQuery，而不是将其放在body标记中。

像这样：

jQuery(document).ready(function(){
    //do other stuff
});

jQuery(window).on('resize', function(){
    dispScreenWidth();
});

function dispScreenWidth() {
    jQuery('#diag').css('display', 'inline');
    jQuery('#diag').html('');
    jQuery('#diag').append(window.innerWidth + ', ');

    alert('display');
}

关于javascript - onResize()在WordPress 4.7.2中不起作用，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/42336094/

onresize

javascript - onResize()在WordPress 4.7.2中不起作用