未捕获的TypeError：无法读取未定义的属性'scrollHeight' [英] Uncaught TypeError: Cannot read property 'scrollHeight' of undefined

问题描述

为什么我收到此错误：

未捕获的TypeError：无法读取未定义的属性'scrollHeight'。

Uncaught TypeError: Cannot read property 'scrollHeight' of undefined.

阅读更多按钮会将我返回到页面顶部，而不是更改< div>的高度元素。我如何解决这个问题？

The "Read more" button returns me to the top of the page instead of changing the height of my <div> element. How do I fix this?

这是我的代码：

function piki( $atts, $content = null ) {
{ ?>
<script type="text/javascript">
var h = jQuery('#piki')[0].scrollHeight;


jQuery('#more').click(function(e) {
    e.stopPropagation();
    jQuery('#piki').animate({
        'height': h
    })
});

jQuery(document).click(function() {
    jQuery('#piki').animate({
        'height': '50px'
    })
})
</script>
<?php }
    $url = '/?s=';
    $str = '';

    $output = array();
    $count = 0;

    foreach (explode(", ",$content) as $content) {
        $count++;
        $output[] = "<a href='" . $url . $content . "'>" . $content . "</a>";
        if ($count == 50) {
            break;
        }
    }

    return '<div id="piki" class="piki">'.implode(", ", $output).'</div><a id="more" style="float: left;" href="#">Read more</a>';
}
add_shortcode( 'piki', 'piki' );

推荐答案

问题是 jQuery （'#piki'）[0] 未选择任何元素。因此，当您尝试获取 scrollHeight 时，您将尝试从 undefined 值中获取字段。这是因为< script> 中的代码在浏览器处理< div id =piki... 元素。如果您将< script> 移至它出现并在 div 之后执行，那么JavaScript应该没有错误地执行。

The problem is that jQuery('#piki')[0] is not selecting any elements. So when you try to get scrollHeight, you are trying to get a field from an undefined value. This is because the code in <script> executes before the browser has processed the <div id="piki"... element. If you moved <script> to that it appears and executes after the div, then the JavaScript should execute without error.

这篇关于未捕获的TypeError：无法读取未定义的属性'scrollHeight'的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！