JavaScript中更改全局变量的问题

我目前在更改JavaScript函数中的全局变量值时遇到问题。我使用的代码如下所示：

var open=false；
$（'.header'）。单击（函数（）{
$（this）.find（'span'）.text（函数（\ux，值）{
警报（打开）；
如果（open==false）{
$（this.addClass（'fa-fa-圆'）；
open==true；
}否则{
$（this.addClass（'fa-fa+circle'）；
open==false；
} 
/*返回值=='+'？'-'：'+'*/
});
$（this）.nextUntil（'tr.header'）.slideToggle（100，函数（）{
});
});

当您使用正在比较的

=

或

==

时，例如

open==true

。将其改为赋值

open=true

和

open=false

我已经收集了一些意见和评论。此外，将class

fa

放在相关的html元素上。您不必一直添加或删除它

// a module to make the open variable local
(function() {

  var open = false;
  $('.header').click(function() {
    $(this).find('span').text(function(_, value) {
      alert(open);
      if (open == false) {
         // remove plus before adding minus
        $(this).removeClass('fa-plus-circle')
          .addClass('fa-minus-circle');
        open = true; // change to assignment
      } else {
        // remove minus before adding plus
        $(this).removeClass('fa-minus-circle')
          .addClass('fa-plus-circle');
        open = false; // change to assignment
      } /*return value == '+' ? '-' : '+' */
    });
    $(this).nextUntil('tr.header').slideToggle(100, function() {});
  });

})();

---

当您使用

=

或

=

进行比较时，例如

open==true

。将其改为赋值

open=true

和

open=false

我已经收集了一些意见和评论。此外，将class

fa

放在相关的html元素上。您不必一直添加或删除它

// a module to make the open variable local
(function() {

  var open = false;
  $('.header').click(function() {
    $(this).find('span').text(function(_, value) {
      alert(open);
      if (open == false) {
         // remove plus before adding minus
        $(this).removeClass('fa-plus-circle')
          .addClass('fa-minus-circle');
        open = true; // change to assignment
      } else {
        // remove minus before adding plus
        $(this).removeClass('fa-minus-circle')
          .addClass('fa-plus-circle');
        open = false; // change to assignment
      } /*return value == '+' ? '-' : '+' */
    });
    $(this).nextUntil('tr.header').slideToggle(100, function() {});
  });

})();

请试试这个…
还请注意，“=”

运算符主要用于为变量分配新值

<div class="header">
    <span></span>
</div>

<script>
    var open = false;
    $('.header').click(function () {
        $(this).find('span').text(function (_, value) {
            console.log(open);//better way to examine code

            if (!open) {
                $(this).addClass('fa fa-minus-circle');
                //open == true; This can only be used as a condition...
                open=true;//but here you re-assign a new property / value and then the variable changes

            } else {
                $(this).addClass('fa fa-plus-circle');
                //open == true; This can only be used as a condition...
                open=true;//but here you re-assign a new property / value and then the variable changes

            }

            //Perhaps you might also be interested in using tenary operators...
            !(open)?(function(e){
                open=true;
                $(e).addClass('fa fa-minus-circle');
            })($(this)):(function(){
                open=true;
                $(e).addClass('fa fa-minus-circle');
            })($(this));

        });
        $(this).nextUntil('tr.header').slideToggle(100, function () {

        });
    });
</script>


var open=false；
$（'.header'）。单击（函数（）{
$（this）.find（'span'）.text（函数（\ux，值）{
console.log（open）；//检查代码的更好方法
如果（！打开）{
$（this.addClass（'fa-fa-圆'）；
//open==true；这只能用作条件。。。
open=true；//但是在这里您重新分配了一个新的属性/值，然后变量就改变了
}否则{
$（this.addClass（'fa-fa+circle'）；
//open==true；这只能用作条件。。。
open=true；//但是在这里您重新分配了一个新的属性/值，然后变量就改变了
}
//也许您还对使用十进制运算符感兴趣。。。
！（打开）？（功能（e）{
开放=真实；
$（e）.addClass（'fa-fa-圆'）；
})（$（this））：（function（）{
开放=真实；
$（e）.addClass（'fa-fa-圆'）；
})（$（本））；
});
$（this）.nextUntil（'tr.header'）.slideToggle（100，函数（）{
});
});
请尝试此…

还请注意，“=”
运算符主要用于为变量分配新值

<div class="header">
    <span></span>
</div>

<script>
    var open = false;
    $('.header').click(function () {
        $(this).find('span').text(function (_, value) {
            console.log(open);//better way to examine code

            if (!open) {
                $(this).addClass('fa fa-minus-circle');
                //open == true; This can only be used as a condition...
                open=true;//but here you re-assign a new property / value and then the variable changes

            } else {
                $(this).addClass('fa fa-plus-circle');
                //open == true; This can only be used as a condition...
                open=true;//but here you re-assign a new property / value and then the variable changes

            }

            //Perhaps you might also be interested in using tenary operators...
            !(open)?(function(e){
                open=true;
                $(e).addClass('fa fa-minus-circle');
            })($(this)):(function(){
                open=true;
                $(e).addClass('fa fa-minus-circle');
            })($(this));

        });
        $(this).nextUntil('tr.header').slideToggle(100, function () {

        });
    });
</script>


var open=false；
$（'.header'）。单击（函数（）{
$（this）.find（'span'）.text（函数（\ux，值）{
console.log（open）；//检查代码的更好方法
如果（！打开）{
$（this.addClass（'fa-fa-圆'）；
//open==true；这只能用作条件。。。
open=true；//但是在这里您重新分配了一个新的属性/值，然后变量就改变了
}否则{
$（this.addClass（'fa-fa+circle'）；
//open==true；这只能用作条件。。。
open=true；//但是在这里您重新分配了一个新的属性/值，然后变量就改变了
}
//也许您还对使用十进制运算符感兴趣。。。
！（打开）？（功能（e）{
开放=真实；
$（e）.addClass（'fa-fa-圆'）；
})（$（this））：（function（）{
开放=真实；
$（e）.addClass（'fa-fa-圆'）；
})（$（本））；
});
$（this）.nextUntil（'tr.header'）.slideToggle（100，函数（）{
});
});
Btw，您的代码正在覆盖
窗口。请打开
方法。最好使用局部变量。And.addClass不执行替换，而是执行追加。您应该使用类似于：$（this）.removeClass（'fa-减号圆fa+circle'）.addClass（…）顺便说一句，您的代码正在覆盖
窗口。open
方法。最好使用局部变量。And.addClass不执行替换，而是执行追加。您应该使用类似于：$（this.removeClass（'fa-减号圆fa+circle'）.addClass（…）