Warum ist der Textbereich mit mysteriösen Leerzeichen gefüllt?


292

Ich habe einen einfachen Textbereich in einer Form wie dieser:

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

Ich bekomme immer mehr Leerraum in diesem Textbereich . Wenn ich darauf gehe, befindet sich mein Cursor wie in der Mitte des Textbereichs und nicht am Anfang? Was ist die Erklärung?

Antworten:


484

Schauen Sie sich Ihren Code genau an. Darin befinden sich bereits drei Zeilenumbrüche und eine Tonne Leerzeichen </textarea>. Entfernen Sie diese zuerst, damit zwischen den Tags keine Zeilenumbrüche mehr auftreten. Es könnte bereits den Trick tun.


4
@ user79685 Gern geschehen. Lesen Sie meinen neuen Kommentar oben, ich habe Sie nicht wirklich lächerlich gemacht. Zumindest nicht gemein :)
Pekka

9
Mmm, dem stimme ich nicht zu. Ich bin sehr für Takt und Etikette in Online-Diskussionen und ich genieße den insgesamt sehr freundlichen Ton auf SO. Auf der anderen Seite muss man ein bisschen Haut entwickeln, wenn man sich im Netz bewegt, das stimmt.
Pekka

2
Sehr schön. Ich war auch mit diesem Problem konfrontiert und habe jeden anderen Trick ausprobiert, vom Trimmen des Textes bis zum Anwenden der Eigenschaft 'text-index' (unter Verwendung von CSS) :-D :-D. (wie dumm von mir). Problem aufgetreten, weil ich den Code in HTML eingerückt habe: -? ... Danke, Ihre Antwort hat mir auch geholfen .. :-)
Gaurav Sharma

3
Verwenden Sie das valueAttribut auch, anstatt Text in die Tags einzufügen.
João Cunha

2
Ein Oldie, aber ein Goodie. Das hat mir heute geholfen. @ Pekka du bist super!
Wordman

73

Nun, alles zwischen <textarea>und </textarea>wird als Standardwert für Ihr Textfeld verwendet. In Ihrem Beispiel gibt es einige Leerzeichen. Versuchen Sie, all das zu beseitigen.


4
Vielen Dank. Mir war nicht klar, dass alles dazwischen die Standardeinstellung ist. Ich habe den Mann an der Spitze ausgewählt, weil er zuerst geantwortet hat, obwohl er mich verspottet hat. Vielen Dank, dass Sie sich für die Leute eingesetzt haben.
Afamee

2
Es ist einfach. Vielen Dank!
Sergio Belevskij

56

Öffnen (und schließen!) Sie Ihre PHP-Tags direkt nach und vor Ihren textareaTags:

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

4
Dies ist eine clevere Möglichkeit, die Einrückung in diesen Fällen beizubehalten. Vielen Dank!
Sebastianb

Dies hat mein Problem endlich behoben. Vielen Dank Bart
Stephen Kennedy

32

Kurz gesagt: <textarea>sollte sofort in derselben Zeile geschlossen werden, in der es begonnen hat.


Allgemeine Vorgehensweise: Hiermit werden Zeilenumbrüche und Leerzeichen addiert, die zum Einrücken im Code verwendet werden.

<textarea id="sitelink" name="sitelink">
</textarea>

Richtige Praxis

<textarea id="sitelink" name="sitelink"></textarea>

Mein Problem gelöst.
S.M_Emamian

Dies war auch für mich die perfekte Lösung
Sheldon R.

Mein Problem gelöst, tolle Lösung. Vielen Dank
Husnain Shabbir

26

Grundsätzlich sollte es sein

<textarea>something here with no spaces in the begining</textarea>

Wenn es einige vordefinierte Leerzeichen gibt, sagen wir aufgrund der Code-Formatierung wie unten

<textarea>.......
....some_variable
</textarea>

Die durch Punkte angezeigten Leerzeichen werden bei jeder Übermittlung immer wieder hinzugefügt.


Dies ist ein alter "Trick", der manchmal sogar vergessen wird. Wir hatten bereits HTML-Probleme, die auf
IE6

Hat meinen Tag gerettet. Vielen Dank!
Reuel Ribeiro

Es funktioniert gut, aber es ist wirklich lustig. Irgendeine Erklärung zu diesem seltsamen Fehler?
Aminu Kano

11

Alle Leerzeichen zwischen dem Öffnen und Schließen von Textbereich-Tags werden als Leerzeichen betrachtet. Für Ihren obigen Code lautet der richtige Weg also:

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

7

Eine andere Möglichkeit wäre die Verwendung von Javascript:

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

//without jquery
document.getElementById('someid').innerHTML = document.getElementById('someid').innerHTML.trim();

Das habe ich getan. Durch das Entfernen von Leerzeichen und Zeilenumbrüchen im Code wird die Zeile zu lang.


5

Verwenden Sie den ternären Operator, um ein bisschen sauberer auszusehen:

<textarea><?=( $siteLink_val ? $siteLink_val : '' );?></textarea>

2
Verwenden Sie keine kurzen Tags, schlagen Sie anderen nicht vor, dies zu tun. Dies hilft Menschen, PITAs zu vermeiden, wenn sie eine Webanwendung in einen Produktionsserver mit einer anderen Konfiguration einfügen. Danke dir.
Alfabravo

4
Ich verwende immer kurze Tags in Template-Szenarien, gerade weil ich möchte, dass mehr Leute sie verwenden, und ermutige daher die PHP-Community, sie weiterhin zu unterstützen. Das heißt, kurze Tags sollten NUR in Template-Szenarien verwendet werden, NIEMALS in der Anwendungslogik und ganz offensichtlich NUR, wenn der Server sie unterstützt. Kennen Sie immer Ihre Produktionsumgebung, bevor Sie sie bereitstellen. (Natürlich ist dies nicht der Ort, um die Vor- und Nachteile von kurzen Tags zu diskutieren, aber Sie haben es angesprochen, das ist meine Rechtfertigung.)
Brian Lacy

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

Umzug ...> nach unten funktioniert bei mir.


4

Ich habe das gleiche Problem und die Lösung ist sehr einfach: Starten Sie keine neue Zeile! Obwohl einige der vorherigen Antworten das Problem lösen können, wird die Idee nicht klar formuliert. Das wichtige Verständnis ist, dass Sie, um die unbeabsichtigten Leerzeichen loszuwerden, niemals eine neue Zeile direkt nach Ihrem Start-Tag beginnen.

Der folgende Weg ist FALSCH und hinterlässt viele unerwünschte Leerzeichen vor Ihrem Textinhalt:

 <textarea>
    text content // start with a new line will leave a lot of unwanted spaces
 </textarea>

Der richtige Weg, dies zu tun, ist:

 <textarea>text content //put text content right after your start tag, no new line
 </textarea>

3

Bitte stellen Sie sicher, dass es keinen Zeilenumbruch oder Leerzeichen gibt. Stellen Sie sicher, dass es keine Leerzeichen oder Tabulatoren gibt. Kopieren Sie einfach diesen Code und fügen Sie ihn ein :) Ich hatte ihn für Sie repariert

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

2

Außerdem: Das Textarea-Tag zeigt Leerzeichen für neue Zeilen, Tabulatoren usw. im mehrzeiligen Code an.


2

Behalten Sie den Textbereichscode ohne zusätzliche Leerzeichen bei

Wenn Sie zusätzliche Leerzeilen sehen, gibt es außerdem eine Lösung in der Metasprache:

<textarea>
for line in lines:
echo line.replace('\n','\r')
endfor
</textarea>

Es werden natürlich Zeilen ohne zusätzliche Leerzeilen gedruckt. Es hängt davon ab, ob Ihre Zeilen mit '\ n', '\ r \ n' oder '' enden - bitte anpassen


2

Der Textbereich zeigt mysteriöse Leerzeichen, da in den Tags ein realer Leerzeichen vorhanden ist. <textarea> <php? echo $var; ?> </textarea> Nach dem Entfernen dieser zusätzlichen Leerzeichen zwischen den Tags wird das Problem wie folgt behoben. <textarea><php? echo $var; ?></textarea>


2

Eine Lösung, die für mich funktioniert hat, ist das Hinzufügen des Stils white-space: normal;zum Textbereich, da es manchmal nicht möglich ist, alle Leerzeichen zu entfernen (z. B. wenn Sie möchten, dass Ihr Code Ihren Codierungsrichtlinien entspricht, die das Hinzufügen von Tabulatoren, Leerzeichen und Zeilenumbrüchen erfordern).

Bitte beachten Sie, dass die Standardeinstellung für Textbereich, zumindest in Chrom, lautet: white-space: pre-wrap;


2

Wenn Sie immer noch Einrückungen verwenden möchten, tun Sie dies nach dem Öffnen des <?phpTags wie folgt:

<textarea style="width:350px; height:80px;" cols="42" rows="5" name="sitelink"><?php // <--- newline
    if($siteLink_val) echo $siteLink_val; // <--- indented, newline
?></textarea>

2

Ich weiß, dass es spät ist, kann aber anderen helfen.

Verwenden Sie diese Option, wenn ein Einzug des Dokuments erforderlich ist.

$('document').ready(function()
{
    $('textarea').each(function(){
            $(this).val($(this).val().trim());
        }
    );
});

selbe Frage


Oder Sie könnten Ihr HTML richtig formatieren. Aber ich bin damit einverstanden, dass es schwierig sein kann, wenn Sie so etwas wie PHP-Code darin haben wollen. Also stimme ich Ihrer Antwort zu.
Niels Lucas

1

Ich bin gegen HTML-Code gemischt mit PHP-Code.

Versuchen Sie jedoch Folgendes:

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

3
Fast ... das beinhaltet noch zwei Zeilenumbrüche.
Amarillion

Sollte verwenden <textarea style="width:350px; height:80px;" cols="42" rows="5" name="sitelink"><?php und ?></textarea>sicherstellen, dass es wirklich rein ist. Darf ich auch fragen, warum Sie mit PHP gegen HTML sind?
FluorescentGreen5

1

Definieren Sie einfach Ihr und Ihr Close-Tag in derselben Zeile.

<textarea class="form-control"
          id="newText"
          rows="6"
          placeholder="Your placeholder here..."
          required
          name="newText"></textarea>

0

Wenn Sie sagen, dass sich der Cursor in der "Mitte" des Textbereichs befindet, denke ich, dass Sie entweder zusätzliche Auffüllung oder Textausrichtung haben könnten : Mitte irgendwo in Ihrem CSS definiert.


0

Stellen Sie zunächst sicher, dass Ihr $ siteLink_val keinen Leerraum als Wert zurückgibt. Das <textarea> -Element hat standardmäßig einen leeren Wert. Wenn also die Variable, die Sie aus irgendeinem Grund wiedergeben, Leerzeichen enthält, liegt Ihr Problem sofort vor.

Um den Code absolut sauber zu machen, würde ich vorschlagen, dass Sie so etwas tun, um später mehr Flexibilität zu ermöglichen. Ich habe eine Funktion erstellt, die entweder NULL zurückgibt, wenn die Variable nicht vorhanden ist (was Sie im ursprünglichen Beitrag anzustreben scheinen), oder ansonsten den absoluten Wert. Versuchen Sie Folgendes, nachdem Sie den Inhalt Ihrer Variablen sichergestellt haben:

function build_siteLink_val() {
     if ( $siteLink_val ) {
          return $siteLink_val;
     }

     else {
          return "";
     }
}

$output_siteLink_val = build_siteLink_val();

Und der folgende Code in Ihrem Textbereich würde jetzt lauten:

<textarea style="width:350px; height:80px;" cols="42" rows="5" name="sitelink"><?=$output_siteLink_val?></textarea>

Dies setzt voraus, dass Ihre PHP-Installation für kurze variable Aufrufe konfiguriert ist, wie in den verkürzten "<? =?>" - Tags zu sehen ist. Wenn Sie auf diese Weise nicht ausgeben können, denken Sie daran, Ihrem PHP-Code "<? Php" voranzustellen und mit "?>" Zu schließen.

Vermeiden Sie Zeilenumbrüche zwischen <textarea>, da dies zu fehlerhaften Zeichen führen kann.

Überprüfen Sie außerdem Ihr CSS, um sicherzustellen, dass keine Auffüllregel Text nach innen drückt.

Außerdem geben Sie im Textbereich einen Wert für Spalten und Zeilen an und formatieren dann eine Breite und Höhe. Diese Regeln sind kontraproduktiv und führen zu inkonsistenten Darstellungen. Halten Sie sich entweder an die Definition der Größe durch Stil (ich empfehle, dem Element eine Klasse zu geben) oder an die Zeilen / Spalten.

Durch die Nutzung unserer Website bestätigen Sie, dass Sie unsere Cookie-Richtlinie und Datenschutzrichtlinie gelesen und verstanden haben.
Licensed under cc by-sa 3.0 with attribution required.