Question

我有此单选按钮，如果选中，我希望它显示2个警报，分别显示（item =“ shoes”）个警报，一个警报来自本地警报，另一个警报来自全局警报，该警报仅显示一个警报意味着该变量仍为空在全球范围内。

/*Empty item*/
var item = '';

/*Function selection item*/
function selection(select) {
  var item = select;
  alert(item);
}

/*If radio button selected item='shoes'*/
$('input[name="selection"]').click(function() {
  if ($(this).is(':checked')) {
    selection('shoes');
  }
});

/*Alert on item if not empty*/
if (item !== '') {
  alert(item); /*NOT WORKING*/
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.0/jquery.min.js"></script>
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"></script>


<input type="radio" name="selection" id="shoes" value="shoes">Shoes<br>

如何将变量从本地范围转移到全局范围？请仅在您确定另一个主题可以解决我的问题时，才将我标记为重复对象。谢谢

Answer 1

这将解决您的问题，但我敦促您考虑采用一种不涉及此类全局状态的方法。

有两个问题。首先，您在函数内部重新声明了item变量，因此您拥有更改的本地副本，而不是全局副本。其次，您不是在更改侦听器中检查是否为空，而是仅在启动时检查。

更好的缩进可能已经清楚了。

/*Empty item*/
var item= ''; 

/*Function selection item*/
function selection(select){
    item = select;
    alert(item);
}

/*If radio button selected item='shoes'*/
$('input[name="selection"]').click(function(){
     if ($(this).is(':checked')){
         selection('shoes');
     }	
     /*Alert on item if not empty*/
     if (item!==''){
         alert(item); /*WORKING NOW THAT IT'S IN THE RIGHT PLACE*/
     }           
 });

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.0/jquery.min.js"></script>  
<input type="radio" name="selection" id="shoes" value="shoes">Shoes<br>

Answer 2

您两次声明了变量

var item= '';

，以及您的功能。因此，将功能更改为

function selection(select) {
  item = select;
  alert(item);
  if (item !== '') {
    alert(item); /*NOT WORKING*/
  }

}

第二个问题是，单击事件后警报将永远无法到达。因此将其移至函数中

这是小提琴：https://jsfiddle.net/1x8pbd3L/

Answer 3

您应该在点击处理程序功能内设置警报。也不要在函数内部重新声明变量item，这将创建一个范围为函数的全新变量：

/*Empty item*/
var item= ''; 
/*Function selection item*/
function selection(select){
  item = select;
  alert(item);
}
/*If radio button selected item='shoes'*/
$('input[name="selection"]').click(function(){
  if ($(this).is(':checked')){         
    selection('shoes');            
  }	
  /*Alert on item if not empty*/
  if(item!==''){
    alert(item); /*NOT WORKING*/
  }
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.0/jquery.min.js"></script>  
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"></script>  


<input type="radio" name="selection" id="shoes" value="shoes">Shoes<br>

Answer 4

如果要“将变量从本地范围转移到全局范围”，请使用return。

var item = '';
function selection(select) {
    var item = select;
    alert(item);
    return item; //<========
}
$('input[name="selection"]').click(function() {
    if ($(this).is(':checked')) {
    item = selection('shoes'); //<========
    }
});

if (item !== '') {
    alert(item); 
}

Answer 5

首先，javascript在页面加载时运行。因此，您在item变量中设置了var item = '';空值，并在下面选中

if (item != '') {
      alert(item); /*NOT WORKING*/
    }

此代码。在页面加载中，所有脚本都会执行，包括下面的代码，

if (item != '') {
      alert(item); /*NOT WORKING*/
    }

因此，选中单选按钮后，上述代码未运行。

但是，我们可以做到如下，请接受。

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.0/jquery.min.js"></script>  
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"></script>

<input type="radio" name="selection" id="shoes" value="shoes">Shoes<br>

<script type="text/javascript">
    /*Empty item*/
    var item = '';

    /*Function selection item*/
    function selection(select) {
      item = select;
      alert(item);
      sample();
    }

    function sample() {
        alert(item);
    }

    /*If radio button selected item='shoes'*/
    $('input[name="selection"]').click(function() {
      if ($(this).is(':checked')) {
        selection('shoes');
      }
    });
</script>

Javascript-从函数

5 个答案: