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

Question

我有这个：

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

如果我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工作正常，但是他不会分配新的String。

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

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

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

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

并将其分配给string3。如果我想在 onchange-function 之外使用 string3 它是 undefined.

Answer 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);
     }

Answer 2

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

这意味着您的 prio.onchange = function () { ... } 将不会执行，除非您转到 HTML 页面，单击 select 元素 并更改 它的价值。

因此，一旦代码加载到您的浏览器中，将执行的是以下内容（它并不完全正确，但可以帮助您理解为什么您的 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);
}

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

Can't assign a string to another string in an onchange = function()

javascript

variables

onchange

variable-assignment

jquery-selectbox