无法在 onchange = function() 中将字符串分配给另一个字符串答案

【问题标题】：Can't assign a string to another string in an onchange = function()无法在 onchange = function() 中将字符串分配给另一个字符串
【发布时间】：2016-01-07 15:31:26
【问题描述】：

我有这个：

<select id="prio" class="w60">
    <option value="1">1</option>
    <option value="2">2</option>
    <option value="3">3</option>
</select>

如果我选择另一个值，则会调用 onchange = function()：

var prio = document.getElementById('prio');
var string1 = "Hello";
var string2 = "";

    prio.onchange = function () 
    {
        prioIndex = prio.options[prio.selectedIndex].text;
        switch (prioIndex) 
        {
           case '1': prioIndex = " my Friend";
                     break;
           case '2': prioIndex = " my Sister and Brother";
                     break;
           case '3': prioIndex = " my Mom and Dad";
                     break;
         }
       alert(prioIndex);
       string2 = prioIndex;
     }


alert(string2);

函数内的警报工作正常，但他不会分配新的字符串。

alert(string2) 显示 string2（未定义）。

我想在函数外使用string2。但我不能，因为它从未被分配。但我不知道为什么。

可以说，我想在另一个 onchange 函数中使用string2...

var string3;
news.onchange = function () 
{ 
   string3 = string2.concat(' how are you');
   alert(string3);
}

并将其分配给string3。如果我想在 onchange 函数之外使用string3，那就是undefined。

【问题讨论】：

标签： javascript variables variable-assignment onchange jquery-selectbox

【解决方案1】：

这是因为alert(string2) 不在点击处理程序中，并且只会执行一次，这与prio 是否被点击无关。尝试将其移动到内部，以检查每次点击时 string2 的值。

prio.onchange = function () 
    {
        prioIndex = prio.options[prio.selectedIndex].text;
        switch (prioIndex) 
        {
           case '1': prioIndex = " my Friend";
                     break;
           case '2': prioIndex = " my Sister and Brother";
                     break;
           case '3': prioIndex = " my Mom and Dad";
                     break;
         }
       alert(prioIndex);
       string2 = prioIndex;
       alert(string2);
     }

【讨论】：

【解决方案2】：

JavaScript 有我们所说的“回调”。回调是在设置回调的元素上发生操作时执行的函数。因此，只有在您更改 HTML 页面上的 prio 元素时，才会执行您的 onchange 函数。

这意味着您的prio.onchange = function () { ... } 不会执行，除非您转到 HTML 页面，点击您的选择元素并更改其值。

因此，一旦代码加载到您的浏览器中，将执行以下操作（这并不完全正确，但可以帮助您理解为什么您的 string2 没有按预期分配）：

var prio = document.getElementById('prio');
var string1 = "Hello";
var string2 = "";
alert(string2);

你能看出问题吗？正确的！！！调用 alert(string2) 时，string2 为空！ :D

您可以通过将 string2 从回调中的另一个函数传递给其他函数来做您想做的事情，例如：

var foo = function ( val ) {
  alert('string2 value is: ' + val);
};

prio.onchange = function () {
  prioIndex = prio.options[prio.selectedIndex].text;

  switch (prioIndex) {
    case '1': prioIndex = " my Friend";
              break;
    case '2': prioIndex = " my Sister and Brother";
              break;
    case '3': prioIndex = " my Mom and Dad";
              break;
  }

  foo(prioIndex);
}

但是，如果您想在两个不同的回调中使用该信息，您可以定义一个函数来在需要时获取该值。我的意思是：

var string2 = function () {
  var prio = document.getElementById('prio');
  prioIndex = prio.options[prio.selectedIndex].text;

  switch (prioIndex) {
    case '1': prioIndex = " my Friend";
              break;
    case '2': prioIndex = " my Sister and Brother";
              break;
    case '3': prioIndex = " my Mom and Dad";
              break;
  }

  return prioIndex;
}

var string3;
news.onchange = function () { 
  string3 = string2() + ' how are you';
  alert(string3);
}

【讨论】：