javascript - Appending text to text area on click? -


javascript (jquery):

$("#content-styling-bar td").click(function() {   if ($(this).text() == "bold ") {     $("#description").append("<b></b>");   } }); 

html:

<table id="content-styling-bar">           <tr>             <td>               bold             </td>             <td>               italic             </td>             <td>               underline             </td>             <td>               main heading             </td>             <td>               sub heading             </td>             <td>               link             </td>             <td>               image             </td>           </tr>         </table> 

i have code. code site's blog administration. idea when click on bold table cell, jquery gets text contained in table cell, , script determines tag-set append textarea.

i prefer method of comparing text within cells adding unique functions onclick parameter of each cell because i'd keep code dry, , involve creating bunch of functions same thing, or adding lot of onclick attributes aren't needed.

i have verified elert i'm indeed getting text "bold" when call $(this).text(), doesn't seem satisfy if statement.

what issue javascript?

i have verified elert i'm indeed getting text "bold" when call $(this).text(), doesn't seem satisfy if statement.

what issue javascript?

most spaces, such 1 have @ end of string you're checking ("bold ").

i wouldn't way @ all, it's fragile , repetitive, you'll have huge if/else , changing presentation text in 1 place can blow code elsewhere. instead, i'd use data-* attribute:

html:

<table id="content-styling-bar">   <tr>     <td data-tag="b">       bold     </td>     <td data-tag="i">       italic     </td>     <!-- ... -->   </tr> </table> 

then:

$("#content-styling-bar td").click(function() {     $("#description").append(document.createelement($(this).attr("data-tag"))); }); 

if have more complex cases, still gives isn't presentation text switch on, , automates common case:

$("#content-styling-bar td").click(function() {     var tag = $(this).attr("data-tag");     switch (tag) {         case "img":             handleimage();             break;         case "a":             handlelink();             break;         default: // "b", "i", "u", "h1", "h2", ...             $("#description").append(document.createelement(tag));             break;     } }); 

Comments

Popular posts from this blog

c# - Binding a comma separated list to a List<int> in asp.net web api -

Delphi 7 and decode UTF-8 base64 -

html - Is there any way to exclude a single element from the style? (Bootstrap) -