J'ai besoin de rendre le texte sélectionné en gras/italique/souligné en utilisant javascript, et aussi enregistrer et récupérer le même en utilisant C#

Question

Je dois faire le texte sélectionné de la zone de texte gras/italique/souligner en utilisant javascript. Pour cela, j'utilise le code suivant.

<img src="~/images/Bold" alt="Bold" onclick="changeFont('TextBox1','b');" /> 
<img src="~/images/Italic" alt="Italic" onclick="changeFont('TextBox1','i');" /> 
<img src="~/images/Underline" alt="Underline" onclick="changeFont('TextBox1','u');" /> 

<script type="text/javascript" language="javascript"> 
    function changeFont(txt, change) { 
     if (change == 'b') { 
      if (document.getElementById(txt).style.fontWeight == 'bold') 
       document.getElementById(txt).style.fontWeight = 'normal'; 
      else 
       document.getElementById(txt).style.fontWeight = 'bold'; 
     } 
     else if (change == 'i') { 
      if (document.getElementById(txt).style.fontStyle == 'italic') 
       document.getElementById(txt).style.fontStyle = 'normal'; 
      else 
       document.getElementById(txt).style.fontStyle = 'italic'; 
     } 
     else { 
      if (document.getElementById(txt).style.textDecoration == 'underline') 
       document.getElementById(txt).style.textDecoration = 'none'; 
      else 
       document.getElementById(txt).style.textDecoration = 'underline'; 
     } 
    } 
</script> 

Mais la question ici est, quand je clique sur l'image audacieuse de son rendre le texte entier en gras, mais pas le texte sélectionné. Cela ne fonctionne pas non plus pour les deux autres images.

Lors de l'enregistrement du texte de zone de texte, je ne peux pas obtenir le texte, y compris les balises HTML, même après avoir essayé avec

document.getElementById('TextBox1').innerHTML; 

Je suis en mesure d'obtenir que la valeur de zone de texte.

Est-il possible d'enregistrer et de récupérer la même chose en utilisant javascript ou C#

Merci à l'avance SC

Answer 1

Voici une question qui répond à votre problème à obtenir le texte en surbrillance How to get selected text in textarea?

A propos de la mise en gras du texte sélectionné, vous devrez utiliser des balises html ou quelque chose comme bbcode et l'analyser en HTML lorsque vous l'imprimez sur une page.

EDIT: Here is a page that shows the jquery plugin "fieldselection" in action.

EDIT 2: Voici un exemple de la façon dont je l'ai fait: jsfiddle link

Le code HTML:

<input id="bold" type="button" value="B" /> 
<br /> 
<textarea id="editor"></textarea> 

<div id="resultAsHtml"></div> 
<br /> 
<div id="resultAsText"></div> 

Le javascript (jquery) code:

$(document).ready(function() { 

    $("#editor").keyup(Update); 

    function Update(){ 
     var text = $(this).val(); 
     var result = ParseToHtml(text); 
     $("#resultAsHtml").html(result); 
     $("#resultAsText").text(result); 
    } 

    $("#bold").click(function(){ 
     var range = $("#editor").getSelection(); 
     var textToReplaceWith = "[b]"+ range.text + "[/b]"; 
     $("#editor").replaceSelection(textToReplaceWith , true); 

     var text = $("#editor").val(); 
     var result = ParseToHtml(text); 
     $("#resultAsHtml").html(result); 
     $("#resultAsText").text(result); 
    }); 

    function ParseToHtml(text) { 
     text = text.replace("[b]", "<b>"); 
     text = text.replace("[/b]", "</b>"); 
     text = text.replace(" ","&nbsp;"); 
     text = text.replace("\n","</br>"); 
     return text; 
    } 

    $("#bold").replaceSelection("[b]" + $("#editor").getSelection() + "[/b]", true); 
}); 

Answer 2

document.execCommand ("gras", faux, nul); c'est la plus simple techinique qui a fonctionné pour moi dans tous les navigateurs ...