0

以下是我正在处理的内容的预览： 在此处输入图像描述

标题、文本和图像都是基于用户动态创建的。他们可以选择是否要添加图片，并且可以选择在标题和主要内容中放置什么文本。

不能有任何滚动，所以它必须是可见的并且不能超过那个白色的底部。

我的问题是......我怎样才能限制正文的文本？

  • 如果标题很大并且下降到两行，并且有一张图片，那么为了留在行中而不超过白色，它必须限制在一定数量的字符内。

  • 但是另一个用户可以决定没有图片并将标题保持在一行中，这样用户将有更多的文字要写，所以限制应该不同。

我想对我来说令人困惑的部分是......如果用户没有图片并且标题很短，并创建了一些非常长的文本以适应大小，但后来决定添加图像......然后那个长文本现在将不再适合。所以现在..我不能限制文本，因为它已经在那里了。

我希望这是有道理的。如果有人可以帮助我解决这个问题并给我一些想法，我将非常感激。

4

4 回答 4

2

将此用于用户输入用于添加文本的任何内容。它可以限制他们使用的字符，只需更改 250 值。

<script>
        function countChar(val){
                                var len = val.value.length;
                                if (len >= 250) {
                                    val.value = val.value.substring(0, 250);
                                }else {
                                    $('#charNum').text(250 - len);
                                }
        };


    </script


<textarea id="field" name="description" onKeyUp="countChar(this)"></textarea>
于 2012-04-11T23:28:17.293 回答
1

有几个不同的选择需要考虑。您可能希望限制用户可以为初学者输入的文本数量，以确保它不会溢出。

我可能会做的一件事是在页面上找到您喜欢的最大字符数，并在数据库的输出上使用 substr 以确保它永远不会显示更多。

http://php.net/manual/en/function.substr.php

您可以有一个“更多”链接，这样访问者可以根据需要阅读更多内容，但不会破坏布局。我会为逻辑使用基本的 if 语句（如果图片存在，则将文本修剪为此，如果不存在等）。

希望有帮助。

于 2012-04-11T23:29:31.200 回答
1

它不仅是text你需要的，limit也是image thumbnail影响你网页风格的

为了限制字符串的数量..我会在这里使用脚本表单php trim a string 

function trim_word($str, $length, $suffix = '...') 
{
    $len = strlen($str);

    if ($len < $length) return $str;

    $pattern = sprintf('/^(.{%d,}?)\b.*$/', $length);
    $str = preg_replace($pattern, '$1', $str);
    $str = trim($str);
    $str .= $suffix;

    return $str;
}

它修剪文本并确保它始终以一个单词结尾...

您可以使用http://phpthumb.sourceforge.net/生成thumbnail固定大小的所有您需要做的设置您想要的高度和宽度

于 2012-04-11T23:36:01.623 回答
1

用一个你想要的没有填充的固定高度的容器 div 包围整个东西，并在里面放置另一个没有边距和没有固定高度的内部 div，然后当用户更改内容时创建一个 javascript 函数来检查内部是否div是<容器div；如果没有，则不允许用户进行更改-这样您就可以直接解决问题。

<script>
function checkDivs() {
 if(inner.style.height >= container.style.height) {
 //prevent change
 }
}
</script>
<div id='container'>
  <div id='inner'>
  //User-defined content
  </div>
</div>

此功能将附加到用户将通过其编辑内容的任何 GUI，至于如何防止更改，我必须更多地了解您的程序。

于 2012-04-11T23:56:57.130 回答