Javascript 单击可切换元素的文本更改

我试图在切换元素时将“+”改为“-”。我试过一些方法，但一旦符号改变，它就不会像应该的那样来回切换。我已经搜索了其他帖子，但它们不适合我的代码

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.1/jquery.min.js"type="text/javascript"></script>
<script type="text/javascript">
$(document).ready(function(){
//Hide (Collapse) the toggle containers on load
$("trace_dump").hide();

//Slide up and down on hover
$("h3").click(function(){
    $(this).next("trace_dump").slideToggle("slow");
    $(this).text($('span').text() == '+' ? '-' : '+');
});
});
</script>

$（文档）.ready（函数（）{
//隐藏（折叠）加载时的切换容器
$（“跟踪转储”）.hide（）；
//悬停时上下滑动
$（“h3”）。单击（函数（）{
$（this）.next（“trace_dump”）.slideToggle（“slow”）；
$（this.text（$（'span'）.text（）=='+'？'-'：'+'）；
});
});

…以下是html：

<h3><span>+</span>print_r()</h3>
<trace_dump>
    print_r($e);
</trace_dump>
<h3><span>+</span>var_dump()</h3>
<trace_dump>
    var_dump($e);
</trace_dump>

+print\u r（）
印刷品(港币);；
+var_dump（）
var_dump（$e）；

我能想出一些主意吗？

您需要将其封装在支持显示/隐藏操作的div中。没有html标记

trace\u dump

这很有效。见演示

更新：

jQuery(document).ready(function() {             
$("trace_dump").hide();
//Slide up and down on hover
$("h3").click(function(){
    $(this).next("trace_dump").slideToggle("slow");
    $(this).find("span").html(($(this).find("span").text().trim() == '+' ? '-' : '+'));  
}); 

});

在这方面：

    $(this).text($('span').text() == '+' ? '-' : '+');

此

指的是h3，而不是我认为您想要的

span

试试这个：

$(this).find('span').text($(this).find('span').text()=='+'?'-':'+');

---

在内联条件检查中，查询所有

元素并比较

.text（）

内容。这显然行不通。使用

$（this）。查找（'span'）

，或者更好，这样做：

$(this).find('span').text(function(i, text) {
    return text === '+' ? '-' : '+';
});

---

Demo：

我认为，在第一次调用函数之后，span元素被+或替换- 因此，从下一次调用开始，jquery根本找不到span元素

我还没有测试过它，但是阅读代码让我相信这一点

可能完全移除跨度，并替换为+或-

---

希望它有帮助，这也会起作用。如果将上下文作为第二个参数，那么搜索将限于封闭元素内。在这种情况下，它是“h3”

---

不，代码很好用。我只需要将“+”从+切换为-on。对不起，我想说的是它按原样工作。我使用了XML样式的标记。试试看：（通过下面的jAndy链接）太棒了！！非常感谢。这就是我需要的。谢谢！那也很甜蜜。

 var element = $('span',$(this));
    element.text(element.text() == '+' ? '-':'+');