Why am I getting this weird “​” line break?
handlebars.js, jquery, jquery-mobile
Solution
Ok, so I found a solution from this thread.
The problem is that when you try to fetch the html of a javascript string, you might get `zero width space`.
Unicode has the following zero-width characters:
- U+200B zero width space
- U+200C zero width non-joiner Unicode code point
- U+200D zero width joiner Unicode code point
- U+FEFF zero width no-break space Unicode code point
So to fix my problem by I use regular expression to remove the unicode charecter:
var source = $("#guideListTemplate").html().replace(/[\u200B]/g, '');
Problem
A similar question have been asked (and answered), but there were no answer / solution on how to fix it I'm using jQuery Mobile / Handlebars for my Phonegap project. Up till now everything seemed to work just fine. But suddenly I get this weird line break: ``` "​ " ``` I use the following code to make the list: ``` // HTML <ul id="guideListView" data-role="listview" ></ul> <script id="guideListTemplate" type="text/x-handlebars-template"> {{#if this}} {{#each this}} <li class="guide"> <a href="{{guideUrl}}{{id}}" data-transition="slide" class="ui-nodisc-icon" > <div class="name">{{name}}</div> <div class="num-stores-container no-bold small">Stores: <span class="num-stores">{{storesCount}}</span></div> </a> </li> {{/each}} {{else}} <li class="ui-btn">Sorry, no guides for <span class="city"></span></li> {{/if}} </script> // JS var template = Handlebars.compile($("#guideListTemplate").html()); $('#guideListView').append(template(guides)); $('#guideListView').listview().listview('refresh'); ``` Does anyone know what might be causing this? updated I've tried using `("#guideListTemplate").html().trim()` and `$('#guideListView').html(template(guides));`, but that didn't make any difference. Could this be a big in jQuery Mobile? A bit more debugging and it seems the problem might lie in this: ``` <script id="guideListTemplate" type="text/x-handlebars-template"> ```