How can I format the text in a JavaScript alert box? I need a word in the text to be underlined.
Add a comment
|
7 Answers
You can use only:
\b = Backspace
\f = Form feed
\n = New line
\r = Carriage return
\t = tab
\000 = octal character
\x00 = hexadecimal character
\u0000 = hexadecimal unicode character
So, you can insert different ASCII characters, but not format them (like italic or bold).
EDIT I also have to mention, that in fact alert acts like toString conversion, so including tags and/or styles is not possible.
4 Comments
Paul S.
You can underline with unicode character
'\u0332'; alert('h̲e̲l̲l̲o̲'); (might not come out as a solid line, though)
brasofilo
It's possible to do some interesting stuff with those hexa numbers
ashleedawg
Thanks, but I'm curious what you're expecting
\fFormFeed to accomplish within an alert?Underline a string using unicode character '\u0332', called a COMBINING LOW LINE
function underline(s) {
var arr = s.split('');
s = arr.join('\u0332');
if (s) s = s + '\u0332';
return s;
}
var str = underline('hello world'); // "h̲e̲l̲l̲o̲ ̲w̲o̲r̲l̲d̲"
alert(str);
This method is not guaranteed to produce a smooth underline.
Example of confirm() on Firefox 59:
1 Comment
Ste
I needed this for a prompt box to underline the Y in Yes.
Y\u0332es. Thank you. I've just tested var str = underline(underline('hello world')); and it makes the underline double up if that's what anyone is after. You can also give it 3 etcetera like so: var str = underline(underline(underline('hello world')));You can not style the text inside an alert box. But you can use a modal box solution instead, here's a list to get you started:
- Dialog, from jQuery UI
- Simple Modal
- leanModal
- Reveal: jQuery Modal
Comments
In my case I created internationalization through a JavaScript file. I needed a mnemonic on each button so I was looking for an easy solution. Actually, I've an easy approach to get the wanted result:
\u0332 is the Unicode Character COMBINING LOW LINE
With this character you can underline single letters.
Demonstration:
alert('S\u0332earch - s underlined');
i18n = {};
i18n.SEARCH = "S\u0332earch - s underlined";
document.getElementById('search').innerHTML = i18n.SEARCH;<button id="search"></button>
Comments
Update: Browsers have started to disable Unicode support in their native dialogs, so this is a dead end.
As two answers suggest the solution is to use Unicode, but you have to do this properly! I also wanted a more reusable solution where I would not need to reinvent the wheel each and every time. So I came up with this small JavaScript function for convenience.
alert('Really need to alert some '+toUnicodeVariant('underlined', 'bold sans', 'underline')+' text');<script src="https://rawgithub.com/davidkonrad/toUnicodeVariant/master/toUnicodeVariant.js"></script>Should produce something like this in all major browsers (try run the code snippet above) :
Comments
You can't. Use external lib as JQuery UI Dialog or your own implementation.
Comments
This is not possible. You'd have to use a plugin. If you have jQuery installed there's a bunch to choose from. If not this one looks promising: http://simplemodal.plasm.it/#examples
