en Javascript / jQuery, comment vérifier une partie spécifique d’une chaîne et déterminer s’il s’agit d’un espace ou d’une lettre?

Je veux écrire une fonction dans laquelle, lorsque je clique n’importe où sur une chaîne (ou une phrase) en HTML, il me dira s’il s’agit d’une lettre ou d’un espace. Est-ce seulement possible? Par exemple, je clique n’importe où dans cette phrase:

The cat in the hat.

Dites que je clique sur la lettre “un” à l’intérieur “du chat”. Je veux qu’il renvoie une alerte me disant que j’ai cliqué sur un personnage. Supposons que je clique sur l’espace entre “chat” et “dans”. Je veux qu’il renvoie une alerte disant que j’ai cliqué sur un espace.

Cela peut sembler impossible, mais une des idées que j’ai est que vous pouvez cliquer quelque part et cocher à gauche et à droite de l’endroit où vous avez cliqué (par exemple, vous avez cliqué à droite entre un espace et une lettre), et si au moins un des caractères est un les espaces blancs (disons à gauche), il devrait revenir que vous avez cliqué sur un espace blanc … serait-ce plus facile à mettre en œuvre? J’ai juste besoin de conseils à ce sujet.

Exemple de travail @ http://jsfiddle.net/Kai/k4YMS/

 function clickify (e) { var arr = e.innerText.split("") || e.textContent.split(""), max = arr.length, i = 0, template = "$c", result = ""; for (; i < max; i += 1) { result += template.replace("$c", arr[i]); } e.innerHTML = result; } 

Ce n’est pas directement possible, mais si vous prenez chaque caractère dans des éléments HTML, cela peut être possible. Voici ce que je pensais:

 var $sentence = $("#sentence"); var sentence = $sentence.html(); //we'll use this after we recreate the sentence function tellMeWhatIAm(){ //as its name says it tells what it is alert($(this).text()); } $.each(sentence,function(i,t){ //clear the sentence if(i==0) $sentence.html(""); //create every char again //and bind click event to our function above var $span = $("",{"text" : t, "click" : tellMeWhatIAm}); //append the chars back to the sentence wrapper $sentence.append($span); }); 

Je ne l’ai pas encore testée, mais l’idée est assez simple.

J’espère que ça aide, Sinan.

En utilisant Range, pas besoin de modifier le code HTML.

  $('#sentence').click(function(e) { if (window.getSelection) { var cursor = window.getSelection().getRangeAt(0).startOffset var str = e.target.innerHTML; alert(str[cursor]); } else { var range = document.selection.createRange(); range.expand('character'); alert(range.text); } });