2015-11-03 122 views
0

此AJAX代码是否有效?我希望视图能够继续调用同一页面,以便在用户上传图片时,只需在该页面上显示给每个人,而不必每隔一段时间刷新一次。我是AJAX的新手,并且还在搞清楚。图片确实出现,但不像我想要的那样。他们没有得到我的CSS样式。如何快速查看ajax电话

<script> 
     $(function(){ 
      $.ajax({ url: 'http://localhost:3000/board' 
       , type: 'GET' 
       , dataType: 'html' 
      }) 
      .done(function(data) { 
       <% print.forEach(function(posts){ %> 
        $('html').append('<div class="post-container">'); 
         $('html').append('<h2> <%= posts.Title %> </h2>'); 
         $('html').append('<hr>'); 
         $('html').append('<a target="_blank" href=<%= "/viewer?id=" + posts.ID %>><img class="post-img" src=<%= "uploaded/" + posts.Img_path %>></a>'); 
        $('html').append('</div>'); 
       <% }); %> 
      }) 
      .fail(function() { 
       console.log("Something went wrong!"); 
      }); 
     }); 

    </script> 

这是路线:

router.get('/board', function(req, res){ 
    connection.query('SELECT * FROM posts, function(err, result){ 
     if(err){ 
      throw err; 
     }else{ 
      res.render('board', {print: result}); 
     } 
    }); 
}); 

回答

1

请您与以下.done()处理尝试:

.done(function(data) { 
    <% print.forEach(function(posts){ %> 
     $('html').append('<div class="post-container">'+ 
       '<h2> <%= posts.Title %> </h2>'+ 
       '<hr>'+ 
       '<a target="_blank" href=<%= "/viewer?id=" + posts.ID %>><img class="post-img" src=<%= "uploaded/" + posts.Img_path %>></a>'+ 
       '</div>'); 
    <% }); %> 
}) 

否则您的通话ajax是好的。

+0

是的,它的工作原理。谢谢你,先生。但还有另一个问题。我在两个选项卡上打开了该页面。当一张图片上传到其中一个标签时,它应该出现在另一个标签上,但这不是发生了什么。我必须刷新。这样AJAX代码就没用了。那我能做些什么? –

+0

谢谢。我对node.js并不熟悉,但在这个特定的场景中;你必须在每隔几秒钟后进行一次'ajax'调用,让它说出20秒左右。由于频繁的GET调用;最新的数据将在您的页面上提供。 – vijayP