Question

我有一个简单的脚本，应该从+更改为- 当Content开放时，向后但现在，当它变为-时，无论如何都会保持为-。即使您折叠了内容，它仍会保留为-。

我试图扭转这些功能，但它与+的功能相同。

的jQuery

$(document).ready(function(){
    $("#expanderHead").click(function(){
        $("#expanderContent").slideToggle();
    if ($("#expanderSign").text() != "+"){
        $("#expanderSign").html("-")
    } else {
        $("#expanderSign").html("+")
    }
    });
});

HTML

<span id="expanderHead" style="cursor:pointer;">
    Lorem ipsum Lorem ipsum Lorem ipsum.
    <span id="expanderSign">+
    </span></span>
    <div id="expanderContent" style="display:none; color: green;">
    <sup><p>Lorem ipsumLorem ipsumLorem ipsum<br>
    Lorem ipsumLorem ipsumLorem ipsumLorem ipsum,<br>
     Lorem ipsumLorem ipsumLorem ipsum.</p>
     </sup>
  </div>

Answer 1

你的逻辑是错误的，你说这个符号目前不是+（它是-），然后将其设置为-。该标志始终为-。

将您的条件更改为：

if ($("#expanderSign").text() == "+"){

或者如何使用text()方法使用函数：

$("#expanderSign").text(function(i,v){
    return v == '-' ? '+' : '-';
})

JSFiddle

Answer 2

你的条件检查逻辑是错误的，试试这个：

if ($("#expanderSign").text() == "+"){
    $("#expanderSign").html("-")
}
else {
    $("#expanderSign").html("+")
}

Answer 3

如果不加上，即减号，则需要将其更改为加号。

if($("#expanderSign").html() != "+") { // is anything but a '+'
    $("#expanderSign").html("+");
}
else { // is a '+'
    $("#expanderSign").html("-");
}

您的代码没有看到任何变化，因为您正在将减号更改为减号，并将加号更改为加号。

Answer 4

你是说，如果它不是!=等于加，即。它是负你应该减去：

if ($("#expanderSign").text() != "+"){
    $("#expanderSign").html("-");

所以只需将!=更改为==：

if ($("#expanderSign").text() == "+"){
    $("#expanderSign").html("-");

Answer 5

逻辑向后显示要显示的符号。见下面的小提琴。

$(document).ready(function () {
    $("#expanderHead").click(function () {
        $("#expanderContent").slideToggle();
        // Backwards logic
        if ($("#expanderSign").text() != "-") {
            $("#expanderSign").html("-");
        } else {
            $("#expanderSign").html("+");
        }
    });
});

1

Answer 6

“如果没有= +将其设置为负”

基本上，如果它=' - '将它设置为' - '就是你现在所设定的。尝试更改！= to ==。

Answer 7

HTML中的

：

<span id="expanderSign">+</span>
no carriage return-------^

JS中的

：

$("#expanderSign").html($("#expanderSign").html() != "+" ? "+" : "-");

Answer 8

我实际上是在自己工作。它有点笨拙，但有效。

$(document).ready(function(){
                                var expanded = false;
                                var collapsed = true;
                                $("#expanderHead").click(function(){
                                    if (expanded == true) {
                                        expanded = false;
                                        collapsed = true;
                                    } else {
                                        expanded = true;
                                        collapsed = false;
                                    }

                                if (expanded == true) {
                                    $("#expanderSign").html("-");
                                    $("#expanderContent").slideToggle();}

                                if (collapsed == true) {
                                    $("#expanderSign").html("+");
                                    $("#expanderContent").slideToggle();}
                                });
                            });

jQuery - 文本只切换一次

的jQuery

HTML

8 个答案: