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
Post a Comment