使用jQuery更改文本

时间:2012-04-06 17:37:17

标签: javascript jquery html dom

我要做的是在可扩展标题中添加[+][-]符号,以便用户点击标题后,其内容部分将会显示,其标志部分将会显示从+更改为-,反之亦然。由于有多个标题,我使用了jQuery的next()。到目前为止,.content切换效果很好,但由于某种原因,这个符号没有改变。

<script type="text/javascript">
jQuery(document).ready(function() {
  jQuery(".content").hide();

  jQuery(".heading").click(function()
  {
    jQuery(this).next(".content").toggle();
    if (jQuery(this).next(".sign").text()=="[+]")
    {jQuery(this).next(".sign").text("[-]");}
    else
    {jQuery(this).next(".sign").text("[+]");}

  });
});
</script>

for (int i = 0; i < nodes.getLength(); i++)
 {
   Element element = (Element) nodes.item(i);
   NodeList title = element.getElementsByTagName("Title");
   Element ttl = (Element) title.item(0);
   String linkTitle = getCharacterDataFromElement(ttl);
   htmlReturn += "<a href='#' class='heading'><h4>" + linkTitle + " <span class='sign'>[+]</span></h4></a>";
   htmlReturn += "<div class='content'>";

    ...

}

3 个答案:

答案 0 :(得分:4)

由于该标志是标题的后代元素,而不是兄弟,请使用find代替next

var sign = jQuery(this).find(".sign");
sign.text(sign.text() === "[+]" ? "[−]" : "[+]");
// Note: A minus sign (−) has the same width as a plus sign (+),
// whereas a hyphen (-) is typically narrower.

答案 1 :(得分:1)

if (jQuery(".sign").text()=="[+]")
{jQuery(".sign").text("[-]");}
else
{jQuery(".sign").text("[+]");}

答案 2 :(得分:0)

嗯,next()只能得到直接的兄弟姐妹。请尝试使用closest()