使用标签，滚动播放数据库信息

我们知道在页面中使用<marquee>标签实现图片或文字的滚动播放，是很方便的。比起使用js方法要少些很多代码。但是通常<marquee>标签只能滚动播放设置在标签中的一条信息。有时我们需要滚动播放多条信息，一次播放一条。例如，我们要在数据库中存放了多条信息，需要在页面上逐条滚动播放。这样又该如何实现呢？还是直接上代码更有说服力：

<%
    request.setCharacterEncoding("UTF-8"); 
    Message message = new Message();
    String sql = "select * from message order by MessageID desc";
    try {
        DBConnection DBConn = new DBConnection();   // 实例化数据库连接类
        Connection Conn = DBConn.getConn();               // 获得数据库连接
        Statement stmt = Conn.createStatement();
        ResultSet rs = null;
        stmt = Conn.createStatement();
        rs = stmt.executeQuery(sql);
%>
        <div id=marqueeDiv>
            <div id="marqueeA" style="display:none;">
<%
        while (rs.next()) {
            int MessageID = rs.getInt("MessageID");    
            String MessageTitle = rs.getString("MessageTitle");
%>
            <a href="messageDetail.jsp?messageId=<%=MessageID%>"><font color="red" size="4">最新消息：<%=MessageTitle%></font></a>
<%
          }
%>
    </div>
</div>
<%
    } catch (Exception e) {
        e.printStackTrace();
    }
%>
<script src="js/jquery.min.js">
</script>
<script src="js/jquery-ui.min.js">
</script>
<script>
    $(window).load(function() {
        jump();
        setInterval(jump, 5000);
    });
    
    var index = -1;
    function jump() {
        var marquee = $('<marquee direction="up" height="40px" align="top"' 
                         + 'hspace="100" width="40%" scrollamount=1 loop="1" onMouseOver="stop();"'
                         + 'onMouseOut="start();"></marquee>');
        var len = $("#marqueeA").find("a").length;
        if (index != len - 1) {
            $('marquee').remove();
            $("#marqueeA").find("a").eq(index + 1).clone().appendTo(marquee);
            marquee.appendTo('#marqueeDiv');
            index++;
        } else {
            $('marquee').remove();
            //初始化计数器
            index = -1;
            //最后一次setInterval循环的下一次，相当于初始化
            jump();
        }
    }
</script>

通过以上方式可以实现数据的逐条播放！

我们可以将上面的代码专门放在一个jsp文件中，就叫broadcastMessage.jsp吧，然后在需要滚动播放的页面上插入该文件即可。