在选择选项上发生onchange事件时，TextArea值不会更新答案

【问题标题】：textarea value does not update when onchange event takes place on select option在选择选项上发生onchange事件时，TextArea值不会更新
【发布时间】：2013-07-08 23:00:48
【问题描述】：

我想知道为什么当用户从下拉菜单中选择时我的 textarea 的值没有更新？我是否使用不正确的字符串值条件？

这就是我想要发生的事情；当用户选择 Filer Changes 选项时，我希望 textarea 填充默认值，和/或允许用户更新值，将其发布到 php 页面。

 <html><head>
  <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
   <title></title>
   <script type="text/javascript"><!--
         function updateDescImpact() {
         var changeSel = document.changeform.changeType;
         var changeType = parseInt(changeSel.options[changeSel.selectedIndex].value);
         if(changeType == "Filer Changes") {
            document.changeform.description.value = "This is the Filer Change Description";
            document.changeform.impact.value = "This is the Filer Changes impact statement";
         } else if(changeType == "DNS Changes" ) {
            document.changeform.description.value = "This is the DNS Change Description";
           document.changeform.impact.value = "This is the DNS Changes impact statement";
      } else {
             document.changeform.description.value = "";
             document.changeform.impact.value = "";
      }
     }         

     // -->
     </script>

    </head>
    <body>
    <form name="changeform" method="post" action="">
    <table width="100%"  border="0" cellspacing="1" cellpadding="1">
    <tr>
    <td width="18%">Change Type</td>
    <td width="82%"><select name="ChangeType" id="ChangeType" onchange="updateDescImpact()">
    <option value="Filer Changes">Filer Changes</option>
    <option value="DNS Changes">DNS Changes</option>
    </select></td>
    </tr>
     <tr>
     <td>Description</td>
     <td>
     <textarea name="description" id="description" cols="50" rows="10"> This needs to be updated</textarea></td>
     </tr>
     <tr>

     <td>Impact</td>
     <td>

      <textarea name="impact" id="impact" cols="50" rows="10">This needs to be updated</textarea>
      </td>
     </tr>
     </table>
     </form>
     </body>
     </html>

【问题讨论】：

标签： javascript html textarea onchange

【解决方案1】：

正如 Musa 所说，JavaScript 区分大小写，所以 document.changeform.changeType; 应该是 document.changeform.ChangeType;

然而，仅凭这一点是行不通的。

在updateDescImpact() 的第二行你有：

var changeType = parseInt(changeSel.options[changeSel.selectedIndex].value);

您正在尝试将值解析为整数，然后尝试将其与下一行的字符串进行比较。

摆脱这种数据转换，你应该不会有任何问题：

var changeType = changeSel.options[changeSel.selectedIndex].value;

【讨论】：

我认为这就是问题所在，parseInt('Filer Changes') 给了NaN，这不等于任何东西。
非常感谢 Musa 和 Benjamin，主要问题是我试图将 changeSel 值解析为整数。
很高兴为您提供帮助！如果您愿意，请选择一个答案并关闭问题？
我选择了答案，但你如何结束这个问题？

【解决方案2】：

我不知道您的代码有什么问题，以下工作正常。我做了一些小改动：

删除脚本元素中无用的 HTML 注释分隔符
从侦听器传递对选择的引用
更高效的表单访问
更高效的选择元素值访问

添加了提交按钮

  function updateDescImpact(el) {
    var form = el.form;
    var changeType = el.value;

    if (changeType == "Filer Changes") {
      form.description.value = "This is the Filer Change Description";
      form.impact.value = "This is the Filer Changes impact statement";

    } else if (changeType == "DNS Changes" ) {
      form.description.value = "This is the DNS Change Description";
      form.impact.value = "This is the DNS Changes impact statement";

    } else {
      form.description.value = "";
      form.impact.value = "";
    }
  }         

</script>

<form name="changeform" method="post" action="">
  <table width="100%"  border="0" cellspacing="1" cellpadding="1">
    <tr>
      <td width="18%">Change Type</td>
      <td width="82%"><select name="ChangeType" id="ChangeType" onchange="updateDescImpact(this)">
        <option value="Filer Changes">Filer Changes</option>
        <option value="DNS Changes">DNS Changes</option>
      </select></td>
    </tr>
      <tr>
      <td>Description</td>
      <td>
      <textarea name="description" id="description" cols="50" rows="10"> This needs to be updated</textarea></td>
    </tr>
    <tr>
      <td>Impact</td>
      <td><textarea name="impact" id="impact" cols="50" rows="10">This needs to be updated</textarea></td>
    </tr>
    <tr>
      <td colspan="2"><input type="submit">
  </table>
</form>

【讨论】：

我的原件确实有一个提交按钮，问题是我试图解析一个整数 Var changeType = parseInt(changeSel.options[changeSel.selectedIndex].value); 我删除了 parseInt 并解决了问题