How can I use a multiline value for an HTML tag attribute? (i.e. how do I escape newline?)

22,728

Solution 1

From what I remember about the HTML standard, character entities work in attributes, so this might work:

<sometag someattr="This is a multiline string.&#10;This is the part after the newline." />

I'm not sure if the "newline" you want ought to be &#10; (\n) or &#13;&#10; (\r\n), and I'm not sure if browsers will interpret it the way you want.

Why do you need it? What specific problem are you trying to solve by adding a newline in an HTML tag attribute?

Solution 2

To include a multiline value, just continue the text of the html attribute on the next line in your editor e.g.

<input type="submit" value="hallo
hallo"> 

will put the second hallo under the first

Solution 3

As a general rule newlines in attributes are preserved so your second example would work fine. Did you try it? Can you give a specific example where you are having problems with it?

As test take a look at this:-

<a href="somepage3.html" onclick="javascript: alert(this.getAttribute('thing'))" thing="This is a multiline string.
This is the part after the newline.">some link</a>

The alert include the newline in the attribute.

Solution 4

<a href="somepage.html" onclick="javascript: foo('This is a multiline string. \
This is the part after the newline.')">some link</a>

Javascript needs a backslash at the end of the new line in a string.

Share:
22,728
Kip
Author by

Kip

I've been programming since I got my hands on a TI-83 in precalculus class during junior year of high school. Some cool stuff I've done: Chord-o-matic Chord Player: find out what those crazy chords are named! Everytime: keep track of the current time in lots of time zones from your system tray BigFraction: open source Java library for handling fractions to arbitrary precision. JSON Formatter: a completely client-side JSON beautifier/uglifier. QuickReplace: a completely client-side regex tool. It's behind some ugly developer UI since I created it for myself to use. (Sorry not sorry.)

Updated on December 29, 2020

Comments

  • Kip
    Kip over 3 years

    How do I include a newline in an HTML tag attribute?

    For example:

    <a href="somepage.html" onclick="javascript: foo('This is a multiline string.
    This is the part after the newline.')">some link</a>
    

    Edit: Sorry, bad example, what if the tag happened to not be in javascript, say:

    <sometag someattr="This is a multiline string.
    This is the part after the newline." />
    

    Edit 2: Turns out the newline in the string wasn't my problem, it was the javascript function I was calling. FWIW, "&#10;" can be used for newline in an HTML attribute.

  • Kip
    Kip almost 15 years
    What if it happened to not be within javascript?
  • Ricardo Gomes
    Ricardo Gomes almost 15 years
    are my examples not what you're looking for?
  • Kip
    Kip almost 15 years
    hmm... you're right. the specific problem i was encountering was with the newline inside the javascript, but i assumed it extended to any html attribute in general but i guess i was mistaken. :-/
  • Kip
    Kip almost 15 years
    oops, turns out the problem was actually the javascript function i was calling, not the newline in the tag.
  • Thomas L Holaday
    Thomas L Holaday almost 15 years
    The XML standard for attribute normalization is: w3.org/TR/REC-xml/#AVNormalize You have a good memory :-)
  • Bao
    Bao over 10 years
    It's not working in my case. Why? <input type="text" name="email" value="Enter email here" title="First line sentence.&#10;Second line sentence.><br />
  • Marius Gedminas
    Marius Gedminas over 10 years
    @Baowen: you forgot to terminate your title attribute with a ".
  • Bao
    Bao over 10 years
    @MariusGedminas Hi thanks, that too. But even after adding the ", it's still not working. I am trying to display those texts in a tooltip via jQuery tooltip function.
  • Prasad Silva
    Prasad Silva over 9 years
    Just to clarify, newlines in attribute values ARE preserved,
  • Brian Leishman
    Brian Leishman almost 5 years
    @Bao newline in attributes aren't the same as newlines in the tool tip. A literally newline in HTML doesn't render as a newline
  • Wolf
    Wolf almost 4 years
    Great to find this here (and not at first there w3.org/TR/REC-xml/#AVNormalize). This is an important feature for MediaWiki extensions which often pipe arguments through attributes, for example <youtube description"first paragraph&#10;second paragraph">...
  • Jcyrss
    Jcyrss almost 2 years
    What if there are some blank lines in the value? like <iframe srcdoc='....'>. I need put the whole html in the value string, I have to remove all the blank lines of it ?