Javascript Jquery Ajax ticker消息被截断

在下面的JavaScript代码中，当我传递的消息太大，跨越一个以上的屏幕宽度时，消息被截断。我放了警报语句，发现整个消息都是从web方法到javascript代码的，但在显示它的同时，它截断了消息。由于我是JavaScript的新手（这段代码是我从web上获得的代码位的混合物），因此非常感谢您的帮助。提前感谢您的帮助

$(document).ready(function() {

    //initialize ul;
    $("#scroller").html("");
    var tkhtml = '';
    var successReq = false;


    $.ajax({
        type: "POST",
        url: "GetDataFromWebMethod.aspx/GetDataForTicker",
        data: '{}',
        contentType: "application/json; charset=utf-8",
        dataType: "json",
        success: function(msg) {
            var y = msg.d;
            var x = y.split('~');
            alert(x.length);

            if (x != '') {
                for (n = 0; n < x.length; n++) {
                    tkhtml = tkhtml + '<li>' + x[n] + '</li>';
                }
                alert(tkhtml);
                $("#scroller").html(tkhtml);
                successReq = true;
            }
        },
        error: function(msg) {
            alert("Entered Failure");
        }

    });


    var successReq = false;

    var interval = setInterval(function() {
        if (successReq) {
            clearInterval(interval);
            javacode();
        }
    }, 100);

    function javacode() {
        var speed = 2;
        var items, scroller = $('#scroller');
        var width = 0;

        scroller.children().each(function() {
            width += $(this).outerWidth(true);
        });
        scroller.css('width', width);
        scroll();
        function scroll() {
            items = scroller.children();
            var scrollWidth = items.eq(0).outerWidth();
            scroller.animate({ 'left': 0 - scrollWidth }, scrollWidth * 100 / speed, 'linear', changeFirst);
        }
        function changeFirst() {
            scroller.append(items.eq(0).remove()).css('left', 0); scroll();
        }
    }


}); 

$（文档）.ready（函数（）{
//初始化ul；
$（“#滚动条”）.html（“”）；
var tkhtml=''；
var successReq=false；
$.ajax({
类型：“POST”，
url:“GetDataFromWebMethod.aspx/GetDataForTicker”，
数据：“{}”，
contentType:“应用程序/json；字符集=utf-8”，
数据类型：“json”，
成功：功能（msg）{
var y=msg.d；
var x=y.split（“~”）；
警报（x.length）；
如果（x！=''）{
对于（n=0；n'+x[n]+''；
}
警报（tkhtml）；
$（“#滚动条”）.html（tkhtml）；
successReq=true；
}
},
错误：函数（msg）{
警报（“输入故障”）；
}
});
var successReq=false；
var interval=setInterval（函数（）{
如果（成功请求）{
间隔时间；
javacode（）；
}
}, 100);
函数javacode（）{
无功转速=2；
变量项，滚动条=$（“#滚动条”）；
var宽度=0；
scroller.children（）.each（函数（））{
宽度+=$（此）.outerWidth（真）；
});
css（'width'，width）；
滚动（）；
函数滚动（）{
items=scroller.children（）；
var scrollWidth=items.eq（0）.outerWidth（）；
动画（{'left'：0-scrollWidth}，scrollWidth*100/速度，'linear'，changeFirst）；
}
函数changeFirst（）{
scroller.append（items.eq（0.remove（））.css（'left'，0）；scroll（）；
}
}
}); 

我的css是：

<style type="text/css"> 
    #scroller { height: 100%; margin: 0; padding: 0; line-height: 30px; position: relative; } 
    #scroller li { float: left; height: 30px; padding: 0 0 0 10px; list-style-position: inside; }
    #scrollerWrapper { height: 30px; margin: 30px; overflow: hidden; border: 1px #333 solid; background: #F2F2F2; } 
</style>

#滚动条{高度：100%；边距：0；填充：0；行高度：30px；位置：相对；}
#滚动条li{浮动：左；高度：30px；填充：010px；列表样式位置：内部；}
#ScrollerRapper{高度：30px；边距：30px；溢出：隐藏；边框：1px#333实心；背景：#f2f2；}

我觉得您的

滚动条设置为
宽度：100%
，假设您的
正文
或
html
设置为这样，它将截断为窗口宽度。您应该尝试
width:auto

编辑：：

好的，所以每个li都是
float:left
，这将它从文档的标准流中去掉。尝试使用
display:inline
或
display:inline block
您的CSS是什么样子的？我的CSS是：#滚动条{高度：100%；边距：0；填充：0；行高：30px；位置：相对；}#滚动条{float:left；height:30px；padding:010px；列表样式位置：inside；}#scrollerrapper{高度：30px；边距：30px；溢出：隐藏；边框：1px#333实心；背景：#F2F2F2；}我在CSS中添加了width:auto。但看起来我的浏览器窗口有多大，消息的宽度就有这么大。我想问题出在var scrollWidth=items.eq（0）。outerWidth（）；。但我不知道如何修复它。：-（你是对的，JKirchartz！在我将命令设置为scroller.CSS（'width'，10000）之后）；而不是scroller.css（'width'，width）；它成功了。我非常感谢你的帮助。嗨，JKirchartz，如果你不介意的话，我还有一个问题。当我在我的计算机上运行这个程序时，消息保留在盒子里。但是当我在IIS服务器上发布它时，消息从盒子的两侧溢出。你能建议一些补救措施吗？谢谢你的帮助。还有奇怪的是，它在Firefox和Chrome上运行正常，但在服务器上的IE上运行不正常。但当我运行程序时，它在我的机器上的所有浏览器上都可以正常工作。我不确定，IIS不应该破坏你的CSS…可能需要提出一个新的问题。。。