为什么textarea充满了神秘的白色空间?

Afa*_*mee 265 html php forms textarea

我有一个简单的文本区域,形式如下:

<textarea style="width:350px; height:80px;" cols="42" rows="5" name="sitelink">
    <?php if($siteLink_val) echo $siteLink_val; ?> 
</textarea>
Run Code Online (Sandbox Code Playgroud)

我在这个textarea中不断获得额外的空白区域.当我插入它时,我的光标就像在textarea的中间而不是在开头?解释是什么?

Pek*_*ica 446

仔细查看您的代码.其中,已经有三个换行符,之前有一大堆空白</textarea>.首先删除它们,以便标签之间不再有换行符.它可能已经成功了.

  • 嗯,我不同意.我非常喜欢在线讨论中的机智和礼仪,我非常喜欢SO上的整体非常友好的语气.另一方面,当在网上移动时,需要开发一点皮肤,这是真的. (7认同)
  • @ user79685欢迎你.阅读上面的新评论,我并没有真正嘲笑你.至少不是一种平均的方式:) (3认同)
  • 另外,使用`value`属性而不是在标签内添加文本. (3认同)
  • 非常好.我也面临着这个问题并尝试了其他所有技巧,从修剪文本到应用'text-index'属性(使用css):-D :-D.(我有多傻).出现问题是因为我在html中缩进了代码: - ?...谢谢,你的答案对我有帮助.. :-) (2认同)
  • 一个老人,但一个礼物.这帮我今天出去了.@Pekka你太棒了! (2认同)

ama*_*ion 68

好吧,介于<textarea>和之间的所有内容都 </textarea>用作textarea框的默认值.你的例子中有一些空白.尽量消除所有这些.

  • 非常感谢.我没有意识到中间的一切都是默认的.我选择了那个最重要的人,因为他先回答了这个问题,尽管他嘲笑我.感谢您坚持为人们服务. (4认同)
  • 这很简单。非常感谢! (2认同)

Bar*_*ers 52

在标签之后和之前打开(并关闭!)您的PHP textarea标签:

<textarea style="width:350px; height:80px;" cols="42" rows="5" name="sitelink"><?php
  if($siteLink_val) echo $siteLink_val;
?></textarea>
Run Code Online (Sandbox Code Playgroud)

  • 这是一种在这些情况下保持缩进的聪明方法.谢谢! (4认同)

bee*_*bek 26

基本上它应该是

<textarea>something here with no spaces in the begining</textarea>
Run Code Online (Sandbox Code Playgroud)

如果有一些预定义的空格,可以说由于代码格式如下所示

<textarea>.......
....some_variable
</textarea>
Run Code Online (Sandbox Code Playgroud)

点所示的空格不断添加每个提交.


小智 26

简而言之: <textarea>应该在它开始的同一行立即关闭.


一般实践:这将在代码中添加用于缩进的换行符和空格.

<textarea id="sitelink" name="sitelink">
</textarea>
Run Code Online (Sandbox Code Playgroud)

正确的做法

<textarea id="sitelink" name="sitelink"></textarea>
Run Code Online (Sandbox Code Playgroud)


Gya*_*yan 10

textarea openning和closing标签之间的任何空格都将被视为空格.所以对于上面的代码,正确的方法是:

<textarea style="width:350px; height:80px;" cols="42" rows="5" name="sitelink"><?php if($siteLink_val) echo $siteLink_val; ?></textarea>
Run Code Online (Sandbox Code Playgroud)


Mil*_*ari 7

另一种解决方法是使用javascript:

//jquery
$('textarea#someid').html($('textarea#someid').html().trim());

//without jquery
document.getElementById('someid').innerHTML = document.getElementById('someid').innerHTML.trim();
Run Code Online (Sandbox Code Playgroud)

这就是我做的.删除代码中的空格和换行符会使行太长.


Bri*_*acy 5

为了使它看起来更简洁,请考虑使用三元运算符:

<textarea><?=( $siteLink_val ? $siteLink_val : '' );?></textarea>
Run Code Online (Sandbox Code Playgroud)

  • 我总是在模板场景中使用短标签,正是因为我希望更多人使用它们,从而鼓励 PHP 社区继续支持它们。也就是说,短标签应该只在模板场景中使用,不要在应用程序逻辑中使用,很明显,只有在服务器支持它们时才使用。在部署之前始终了解您的生产环境。(当然,这里不是讨论短标签的利弊的地方,但你提出了,所以这是我的理由。) (4认同)
  • 不要使用短标签,不要建议其他人这样做。这将帮助人们在将某些 web 应用程序放入具有不同配置的生产服务器时避免 PITA。谢谢你。 (2认同)

Er *_*tel 5

我知道它晚了,但可能会帮助其他人。

在需要文档缩进时使用它。

$('document').ready(function()
{
    $('textarea').each(function(){
            $(this).val($(this).val().trim());
        }
    );
});
Run Code Online (Sandbox Code Playgroud)

同样的问题


Wil*_*Hou 5

我遇到了同样的问题,解决方法很简单:不要换行!前面的一些回答虽然可以解决问题,但是思路没有说清楚。在重要的认识是,摆脱无意识的空间,永远只是你的开始标记后开始新的一行。

以下方式是错误的,会在您的文本内容之前留下很多不需要的空格:

 <textarea>
    text content // start with a new line will leave a lot of unwanted spaces
 </textarea>
Run Code Online (Sandbox Code Playgroud)

正确的做法是:

 <textarea>text content //put text content right after your start tag, no new line
 </textarea>
Run Code Online (Sandbox Code Playgroud)


小智 5

只需将所有内容放在一行上即可

<textarea style="width:350px; height:80px;" cols="42" rows="5" name="sitelink"><?php if($siteLink_val) echo $siteLink_val; ?></textarea>
Run Code Online (Sandbox Code Playgroud)