Question

为什么我收到此错误：

未捕获的TypeError：无法读取属性＆＃39; scrollHeight＆＃39;未定义的。

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

这是我的代码：

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' );

Answer 1

问题是jQuery('#piki')[0]没有选择任何元素。因此，当您尝试获取scrollHeight时，您尝试从undefined值获取字段。这是因为<script>中的代码在浏览器处理<div id="piki"...元素之前执行。如果您将<script>移至显示的位置并在 div之后执行，那么JavaScript应该正确执行。

Answer 2

在调用事件处理程序之前始终检查元素是否存在是一个好习惯。

if ( document.getElementById('#piko') ) {
  //call some event handlers on #piko
}

未捕获的TypeError：无法读取属性＆＃39; scrollHeight＆＃39;未定义的

2 个答案: