web-dev-qa-db-fra.com

jQuery + template-side template = "Erreur de syntaxe, expression non reconnue"

Je viens de mettre à jour jQuery de 1.8.3 à 1.9, et tout a commencé à planter.

Ceci est mon modèle:

<script type="text/template" id="modal_template">
    <div>hello</div>
</script>

Voici comment je le lis:

modal_template_html = $("#modal_template").html();

Voici comment je le transforme en objet jQuery (je dois utiliser des méthodes jQuery dessus):

template = $(modal_template_html);

... et jQuery plante!

Erreur: erreur de syntaxe, expression non reconnue: <div> hello </ div>

slice.call (docElem.childNodes, 0) [0] .nodeType;

jquery-1.9.0.js (ligne 3811)

Cependant, si je déclare que template est une variable de texte brut, il recommence à fonctionner:

var modal_template_html = '<div>hello</div>';

Quelqu'un peut-il m'aider à comprendre cela?

UPDATE: L'équipe Jquery a entendu et a changé la situation est redevenue normale en 1.10:

Le changement le plus important que vous verrez probablement est que nous avons assoupli les critères de traitement HTML dans $ (), permettant ainsi des espaces et des nouvelles lignes, comme nous le faisions avant la version 1.9

javascriptjquerymustache
57
Evgeny

Une chaîne commençant par une nouvelle ligne (ou tout autre chose que "<") n'est pas considérée comme une chaîne HTML dans jQuery 1.9

http://stage.jquery.com/upgrade-guide/1.9/#jquery-htmlstring-versus-jquery-selectorstring

121
Evgeny

Je suppose que votre modèle commence par un espace ou un onglet.

Vous pouvez utiliser jQuery comme ça:

$($.parseHtml(modal_template_html)[1]);

ou analyser la chaîne pour supprimer les espaces du début:

$(modal_template_html.replace(/^[ \t]+/gm, ''));
16
Charles

EugeneXa l'a mentionné dans un commentaire, mais cela mérite une réponse:

var template = $("#modal_template").html().trim();

Ceci élimine les espaces incriminés au début de la chaîne. Je l'ai utilisé avec Moustache, comme ceci:

var markup = Mustache.render(template, data);
$(markup).appendTo(container);
8
Kevin C.

Vous pouvez utiliser 

var modal_template_html = $.trim($('#modal_template').html());
var template = $(modal_template_html);
4
Eran H.

En tant que document officiel: À compter de la version 1.9, une chaîne de caractères n'est considérée comme du code HTML que si elle commence par un caractère inférieur à ("<"). Le plugin Migrate peut être utilisé pour restaurer le comportement antérieur à la version 1.9.

Si une chaîne est connue pour être HTML mais peut commencer par du texte arbitraire qui n'est pas une balise HTML, transmettez-la à jQuery.parseHTML () qui renverra un tableau de noeuds DOM représentant le balisage. Une collection jQuery peut être créée à partir de ceci, par exemple: $($.parseHTML(htmlString)). Cela serait considéré comme la meilleure pratique lors du traitement de modèles HTML, par exemple. Les utilisations simples de chaînes littérales telles que $("<p>Testing</p>").appendTo("body") ne sont pas affectées par ce changement.

1
voya

J'ai eu la même erreur:
"Erreur de syntaxe, expression non reconnue: //"
C’est un bogue connu de JQuery, j’avais donc besoin de réfléchir à la solution de rechange,
Ce que j'ai fait est:
J'ai remplacé la balise "script" par "div" 
et ajouté à angular ce code
.__ et l'erreur est partie ...

app.run(['$templateCache', function($templateCache) {
    var url = "survey-input.html";
    content = angular.element(document.getElementById(url)).html()
    $templateCache.put(url, content);
}]);
0
Rivki Aizen