Question

I’m developing a very simple math editor, and I want users to be able to input [÷] and [×] by clicking on buttons. I have put these characters directly in the code. They are rendering as errors. When I try to use ÷ or × the textarea shows ÷ or × rather than [÷] or [×]. I have CSS to set the font to Arial.

The code receives a param called newSymbol and then appends it:

var textArea = $('#symbolsTextArea');
textArea.val(textArea.val() + newSymbol);

Any help would be much appreciated.

Answer 1

Use the unicode characters instead of an HTML special character.

textArea.val(function(i, val) {
    return val + "\u00f7";
});

DEMO: http://jsfiddle.net/QcjCZ/

---

Or if the HTML sequences are easier for you to remember, create a map of HTML to unicode:

var symbol = {
    "÷":"\u00f7",
    "×": "\u00d7"
};

And use it like this:

textArea.val(function(i, val) {
    return val + symbol["÷"];
});