javascript - 如何在 div 顶部制作水平滚动条 通过 ajax 加载内容后工作

Question

HTML 代码

   <div  id="scrollidout"  style="overflow: auto; overflow-y: hidden; ">
    <div id="scrollidin" style="padding-top: 1px; height: 20px; width: 1000px">&nbsp;</div>
</div>
<div class="resultcontent" style="overflow: auto; overflow-y: hidden; " id="resultcontent" >

  SEARCH RESULTS HERE

  <div id="scrollidin12" style="padding-top: 1px; height: 190px; width: 3200px">
    klklklklkklklklklkklklklklkklklklklkklklklklkklklklklkklklklklkklklklklkklklklklkklklklklkklklklklkklklklklkklklklklkklklklklkklklklklkklklklklkklklklklkklklklklkklklklklkklklklklkklklklklkklklklklkklklklklkklklklklkklklklklkklk
    lklklkklklklklkklklklklkklklklklkklklklklkklklklklkklklklklkklklklklkklklklklkklklklklkklklklklkklklklklkklklklklkklklklklkklklklklkklklklklkklklklklkklklklklkklklklklkklklklklkklklklklkklklklklkklklklklkklklklklkklklklklkklklklklkklklklklkklklklklkklklklklkklklklklkklklklklk
  </div>

</div>

JAVASCRIPT 代码

 $(function(){


   $('#scrollidout').on('scroll', function(){
        $('#resultcontent')
            .scrollLeft($('#scrollidout').scrollLeft());
    });

    $('#resultcontent').on('scroll', function(){
        $('#scrollidout')
            .scrollLeft($('#resultcontent').scrollLeft());
    });
  });

首次加载时整个页面工作时它工作 但是当我使用 Ajax 更改 div“#resultcontent”的内容时，我无法使用顶部滚动条再次滚动 div。我该如何解决这个问题？

Answer 1

对你有帮助吗？ https://developer.mozilla.org/fr/docs/Web/CSS/overflow

放置一个带有 overflow :scroll 的类来强制显示滚动条。