使textarea文本变为粗体的按钮

Question

I have a button that has an onclick="bold()" and it is supposed to be changing the font weight from normal to bold and then back to normal. It isn't doing anything though. What do I need to change or add? Here is a jsfiddle if that helps: http://jsfiddle.net/dZVfh/

<script>
    var x = document.getElementById('description-box');
    function bold() {
      if( $(x).css("font-weight") == "normal") {
        $(x).css("font-weight"), "bold");
      }
      else {
        $(x).css("font-weight", "normal");
      }
    }
  </script>

Answer 1

There is a syntax error in your code:

Change

$(x).css("font-weight"), "bold");

to

$(x).css("font-weight", "bold");

---

Full function

function bold() {
    var x = $('#description-box');
    if (x.css("font-weight") !== "bold") {
        x.css("font-weight", "bold");
    } else {
        x.css("font-weight", "normal");
    }
}

---

Working fiddle : http://jsfiddle.net/dZVfh/3/

There were a number of problems in your original fiddle.

• jQuery was not being included

• The function was defined inside domReady - which means it isn't visible when clicking the button

• The CSS block had a syntax error. The style was being closed with a ) instead of a }

• You were trying to assign the element to x before the DOM was ready. The new fiddle does this inside the function (by which time the DOM is ready)

Answer 2

i prefer to have it change class :

add this style

.bold{
    font-weight: bold;
}

change your function :

function bold(){
  if( $(x).hasClass("bold")) {
     $(x).removeClass("bold");
  }
  else {
    $(x).addClass("bold");
  }
}