jQuery.html() being garbled in IE

Question

I am using jQuery("#shipdata").html() function to get the html content of the element, which should return a date string, such as '5/14/2014'. It runs perfectly in Chrome, Firefox and Safari. But in Internet Explorer, it returns something strange:

I tried to alert the length of the returned string and it says "14", which should be "9".

Also I tried to alert the keycode of each character, and found that a keycode of "8206" is being added not only at the beginning of the string, but also before and after the character '/'.

How can I get rid of those garbled characters?

Answer 1

Character 8206, or \u200E, it the "left-to-right mark" character. It is used primarily in bidirectional text to indicate that "this part" should be left-to-right.

Depending on the locale, IE may be inserting these marks to ensure that the date is rendered correctly. For instance, if you are on a computer that is set to a right-to-left language, then it may be using these marks to assist in rendering.

While I don't know what's causing it, you should probably be sanitising the input anyway, for example in case of spaces.

<div id="shipdata">
    5/12/2014
</div>

The above would cause your code to fail too. So, try this:

jQuery('#shipdata').html().replace(/[^0-9\/]/g,'');

Answer 2

By using a small piece of jquery code you can achieve the result. CHECK the DEMO.

jquery code

alert($("#shipdata").html());
alert($("#shipdata").html().length);

HTML CODE

<div id="shipdata">5/12/2014</div>