Question

我需要帮助才能显示img元素必须刷新页面才能看到内容。

<script>      
   function init() {
       $('#pictureBox').attr('src', picture);
   }
</script>

<body onload="init();">
    <img id="pictureBox" src=""></img>
</body>

Answer 1

您应首先preload图片（这会导致图片立即显示），然后您可以动态使用图片。

<script>
   //preloading...
   var mypic = new Image();
   mypic.src = picture;

   $(window).load(function(){
       $('#pictureBox').attr('src', picture);
   });      
</script>

<body>
    <img id="pictureBox" src="" />
</body>

请注意，在html5标准中，img标记不能包含空属性src

Answer 2

你可以使用jQuery代替，代码将是这样的

  <html>
    <head>
        <script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
     <script type="text/javascript">     
        var picture = 'blabla/testimage.jpg';
        $(document).ready(function() {
           $('#pictureBox').attr('src', picture);
        });
       </script>
     <head/>

        <body>
            <img id="pictureBox" src=""/>
        </body>
   </html>

无需刷新页面即可显示img元素

2 个答案: