HTML里的一块区域(比如div或P)要显示一些文字内容,怎么判断该区域是否被字符填满了?

从后台过来的大字段,好几万字,我这边显示的时候要在一个弹出框分页显示,控制每页显示1300字,
在这个基础上分页显示,现在问题是如果内容全是中文就刚好填满,如果内容是英文就每页只填满一半,
我现在需要一个方法来判断一个固定长宽的TD是不是被文字填满了,这种方法应该有的吧,我看见div的高度会随着内容填充自动增加。![图片说明](https://img-ask.csdn.net/upload/201508/27/1440640779_244711.png)图片说明

计算你 文字的字节数 比较容易 超过1300就换页

function getBt(str){
var char = str.replace(/[^\x00-\xff]/g, '**');
return char.length;
}
把是中文的替换成“**”之后再算长度,就能得到字节数

其实你可以不用去考虑是否给占满的问题,因为不同的浏览器或不同的显示分辨率都带来很多麻烦。你就直接设置字体在弹出页面的占宽比就好了,这样无论在哪个情况下都按显示器的宽度比来自动调节

谢谢a7412369gordon的回答,你考虑的很全面 但我不懂设置占宽比怎么能实现分页啊 我现在做的是在js里把一个文本按照每页字数分割成一个数组,然后分页显示

 <script>
  var font_size = 1300;
  var pageIndex=0;  //弹出框页面初始下标

  if(isIE){
  font_size = 1600; //IE浏览器下每页显示1600
  }

  function showDis(ele){  //显示个人简介
  var span = $(ele).parent();
  var dis1 = span.find("input.dis_val").val();
  var name = span.find("input.name_val").val();
  dis1 = $.trim(dis1);
  if(dis1.length==0){
  dis1 = "他很懒,这里什么也没写...";
  }
  var arry_1 = subStringFunc(dis1,font_size);  //将长字符串按指定规格分割成几段,存放在数组中
  //    alert(arry_1.length);
  //    alert(arry_1[5]);
    var diag = new Dialog();
    pageIndex = 0;          //初始页
    diag.Width = 800;
    diag.Height = 600;
    diag.Title = name+"的个人简介";
    diag.OKEvent = function(){  
    }
    diag.CancelEvent = function(){  //点击取消后调用的方法(取消原有的事件绑定)
    }
    diag.InnerHtml=arry_1[0];
    diag.show();
    diag.okButton.value="上一页";
    diag.cancelButton.value="下一页";
    diag.okButton.disabled="true";
    diag.cancelButton.disabled="true";
    var k = pageIndex+1;
    $("#_DialogButtons_0").css({"text-align":"center"});  //更改按钮使其居中
    $("#_myMsgTd_")[0].align="left";                  //更改文字对齐方式为左对齐
    //$("#_myMsgTd_").css({"word-break":'break-all'});  //以字符为单位换行 (解决长串英文不换行问题)

    $("#_ButtonOK_0").after("<span id='_myPageIndex_'>"+k+"</span>"); //显示当前页下标
    $("#_ButtonCancel_0").after("<span id='_myTotalPage_'>共"+arry_1.length+"页</span>"); //显示当总页数

    if(arry_1.length>1){
        $("#_ButtonCancel_0").removeAttr("disabled");
    }
    $("#_ButtonCancel_0").click(function(){//下一页
        pageIndex++;
        updateText(arry_1);
    });
    $("#_ButtonOK_0").click(function(){ //上一页
        pageIndex--;
        updateText(arry_1);
    });

    $("#_myCloseDiv_").click(function(){              //添加关闭事件
    diag.close();
    });
  }

  function updateText(arry_1){
  $("#_Container_0").empty().text(arry_1[pageIndex]);

  $("#_myPageIndex_").empty().text(pageIndex+1);
  if(pageIndex>0){
        $("#_ButtonOK_0").removeAttr("disabled");
    }else{
        $("#_ButtonOK_0").attr("disabled","true");
    }
  if(arry_1.length>pageIndex+1){
        $("#_ButtonCancel_0").removeAttr("disabled");
    }else{
        $("#_ButtonCancel_0").attr("disabled","true");
    }   
  }

  function subStringFunc(str,size){
  var array = Array();
  var length = str.length;
  if(length<=size){
    array[0] = str;
  }else{
  var num =1;
  if(length%size==0)
  num = parseInt(length/size);
  else
  num = parseInt(length/size)+1;
  var temp = '';
 // alert("共有"+num+"页");
  for(var i=0;i<num;i++){
  temp = str.substr(i*size,size);  
  array[i]=temp;        //截取的字符串存放在数组中
  }
  }
  return array;
  }

这是我的代码

<br> var font_size = 1300;<br> var pageIndex=0; //弹出框页面初始下标</p> <p>if(isIE){<br> font_size = 1600; //IE浏览器下每页显示1600<br> }</p> <p>function showDis(ele){ //显示个人简介<br> var span = $(ele).parent();<br> var dis1 = span.find(&quot;input.dis_val&quot;).val();<br> var name = span.find(&quot;input.name_val&quot;).val();<br> dis1 = $.trim(dis1);<br> if(dis1.length==0){<br> dis1 = &quot;他很懒,这里什么也没写...&quot;;<br> }<br> var arry_1 = subStringFunc(dis1,font_size); //将长字符串按指定规格分割成几段,存放在数组中<br> // alert(arry_1.length);<br> // alert(arry_1[5]);<br> var diag = new Dialog();<br> pageIndex = 0; //初始页<br> diag.Width = 800;<br> diag.Height = 600;<br> diag.Title = name+&quot;的个人简介&quot;;<br> diag.OKEvent = function(){<br><br> }<br> diag.CancelEvent = function(){ //点击取消后调用的方法(取消原有的事件绑定)<br> }<br> diag.InnerHtml=arry_1[0];<br> diag.show();<br> diag.okButton.value=&quot;上一页&quot;;<br> diag.cancelButton.value=&quot;下一页&quot;;<br> diag.okButton.disabled=&quot;true&quot;;<br> diag.cancelButton.disabled=&quot;true&quot;;<br> var k = pageIndex+1;<br> $(&quot;#_DialogButtons_0&quot;).css({&quot;text-align&quot;:&quot;center&quot;}); //更改按钮使其居中<br> $(&quot;#_myMsgTd_&quot;)[0].align=&quot;left&quot;; //更改文字对齐方式为左对齐<br> //$(&quot;#_myMsgTd_&quot;).css({&quot;word-break&quot;:&#39;break-all&#39;}); //以字符为单位换行 (解决长串英文不换行问题)</p> <pre><code>$(&quot;#_ButtonOK_0&quot;).after(&quot;&lt;span id=&#39;_myPageIndex_&#39;&gt;&quot;+k+&quot;&lt;/span&gt;&quot;); //显示当前页下标 $(&quot;#_ButtonCancel_0&quot;).after(&quot;&lt;span id=&#39;_myTotalPage_&#39;&gt;共&quot;+arry_1.length+&quot;页&lt;/span&gt;&quot;); //显示当总页数 if(arry_1.length&gt;1){ $(&quot;#_ButtonCancel_0&quot;).removeAttr(&quot;disabled&quot;); } $(&quot;#_ButtonCancel_0&quot;).click(function(){//下一页 pageIndex++; updateText(arry_1); }); $(&quot;#_ButtonOK_0&quot;).click(function(){ //上一页 pageIndex--; updateText(arry_1); }); $(&quot;#_myCloseDiv_&quot;).click(function(){ //添加关闭事件 diag.close(); }); </code></pre> <p>}</p> <p>function updateText(arry_1){<br> $(&quot;#_Container_0&quot;).empty().text(arry_1[pageIndex]);</p> <p>$(&quot;#_myPageIndex_&quot;).empty().text(pageIndex+1);<br> if(pageIndex&gt;0){<br> $(&quot;#_ButtonOK_0&quot;).removeAttr(&quot;disabled&quot;);<br> }else{<br> $(&quot;#_ButtonOK_0&quot;).attr(&quot;disabled&quot;,&quot;true&quot;);<br> }<br> if(arry_1.length&gt;pageIndex+1){<br> $(&quot;#_ButtonCancel_0&quot;).removeAttr(&quot;disabled&quot;);<br> }else{<br> $(&quot;#_ButtonCancel_0&quot;).attr(&quot;disabled&quot;,&quot;true&quot;);<br> }<br><br> }</p> <p>function subStringFunc(str,size){<br> var array = Array();<br> var length = str.length;<br> if(length&lt;=size){<br> array[0] = str;<br> }else{<br> var num =1;<br> if(length%size==0)<br> num = parseInt(length/size);<br> else<br> num = parseInt(length/size)+1;<br> var temp = &#39;&#39;;<br> // alert(&quot;共有&quot;+num+&quot;页&quot;);<br> for(var i=0;i&lt;num;i++){<br> temp = str.substr(i*size,size);<br><br> array[i]=temp; //截取的字符串存放在数组中<br> }<br> }<br> return array;<br> }</p> <p>这是我现在的代码 </p> <pre><code> </code></pre>