Jquery adds and removes this

Question

I like having an h3 header with few characters that say "expand me"

it will look like this: category xyz [+]

I like the function in jquery to chage / delete + to minus when clicked. I know how to add text to a string, but not how to delete it or just a part.

if you have a better approach feel free to tell me .. thanks!

---

note: implement the .remplace function ... but it doesn’t work properly, you can see it here ... the problem in which I used jquery 1.4 switches to 1.4.3, now it works!

Answer 1

, +/- h3, , . :

$("body").delegate("#header a", "click", function(eventObj) {
    if ($(this).text().match(/\+/)) {
        $(this).text($(this).text().replace(/\+/, "-"));
    } else {
        $(this).text($(this).text().replace(/-/, "+"));
    }
});

, jsFiddle.

Answer 2

.

HTML

<h3>Category XYZ
   <span id="toggle">
      <a href="#" class="expand" title="expand me">[+]</a>
      <a href="#" class="hide" title="hide me">[-]</a>
   </span>
</h3>
<div id="toggleContent">This is the text of category XYZ</div>

Javascript

$("span#toggle a").click(function() {
   $("div#toggleContent").toggle();
   $("span#toggle a").toggle();
});

CSS

div#toggleContent { display: none; }
span#toggle a.hide { display: none; }

JSFiddle, .

Answer 3

$( "# idOfObject" ) HTML ( "[-]" );.

, , :)

Answer 4

jQuery html , :

$("#your-selector").text("category xyz[-]");

Answer 5

<span> <span> "class" "id". id Javascript, . , , , . , .

Answer 6

<span class=expandPlus>[+]</span>

-

$("h3").click(function() {
  $(this).children('expandPlus').html('[-]')
  .
  .
  .
});

Answer 7

/, , :

. jsFiddle.

a div. href - div.

<div id="container">
    <ul>
        <li>Category 01 <a href="#cat01">[+]</a></li>
        <li>Category 02 <a href="#cat02">[+]</a></li>
        <li>Category 03 <a href="#cat03">[+]</a></li>
    </ul>
    <br />
    <div id="categories">
        <div id="cat01">content 01</div>
        <div id="cat02">content 02</div>
        <div id="cat03">content 03</div>
    </div>
</div>

toggle, , , 1, , 0. , . , [-] [+]. , . , , a [+] [-].

$("#container ul > li > a").toggle(function (e) {
    var $this = $(this);
    $this.text("[-]"); // change the text
    // select content div using href as the selector
    $($this.attr("href")).css("display", "block");
    // prevent any other behavior
    e.preventDefault();
},
function (e) {
    var $this = $(this);
    $(this).text("[+]"); // switch to collapsed view
    $($this.attr("href")).css("display", null);
    e.preventDefault();
});