0

[问题解决了 ！！！！！！]

word-wrap: break-word属性实际上对我有用。以前导致我无法工作的问题是我在标签中定义了一个white-space: nowrap属性，因此它相互冲突。

这就是为什么 ！！

感谢所有看过这篇文章的人！！

自动换行：断词 摇滚！

我有一个由 div 标签组成的聊天对话，长字从聊天窗口中掉下来

我用谷歌搜索了一些解决方案，然后自动换行：break-word; 财产没有帮助。我也尝试过溢出换行：break-word; 和分词：断词；

我不知道我的聊天对话 div 有什么问题。

这是我的聊天对话 div 的 css：

.chatboxcontent {
 height: 180px;
 padding: 7px;
 width: 226px;
 overflow: auto;
 line-height: 1.3em;
 background-color: rgba(24, 175, 223, 0.25);
     word-wrap: break-word;
}

这是我的聊天对话 html 标签：

<div class="chatboxcontent">
  I want to put my conversation here. 
the content is generated by javascript dynamically.
</div>

这是我生成对话的代码（可能是出错的部分？？？）

if(event.keyCode == 13 && event.shiftKey == 0)  {

    var $message = $(chatboxtextarea).val();
    $message = $message.replace(/^\s+|\s+$/g,"");

    $(chatboxtextarea).val('');
    $(chatboxtextarea).focus();
    $(chatboxtextarea).css('height','20px');
    if ($message != '') {

        $("#chatbox_"+name +" .chatboxcontent").append(myDate());
        $("#chatbox_"+name +" .chatboxcontent").append(username+': ');
        $("#chatbox_"+name +" .chatboxcontent").append($message);
        $("#chatbox_"+name +" .chatboxcontent").append("<br/>");

        // post content to server   
        $.post("sidechat/chat.php", {'from':username, 'to':indentedName, 'content':$message}, 
            function(data){
            //success function
            console.log("send message to db");
        });
    }

    return false;
}

我的问题是长词仍然从聊天窗口中掉下来，就好像自动换行属性没有做任何事情一样。

需要帮忙。

谢谢你

更新------07/16/13----------------

这是 jsFiddle 的链接：http: //jsfiddle.net/f62N9/

它似乎在 jsFiddle 上运行良好，但为什么它在我的 localhost 上什么也没做？

4

0 回答 0