0

別のテーブル セルの変更に基づいてテーブル セルを自動更新しようとしています。ユーザーには、名、姓、およびユーザー名があります。ユーザー名は、最初のイニシャル + 姓で構成されます。私の現在のコードは次のとおりです。

<html>
  <head>
    <script type = "text/javascript">
      function updateUsername(){
        var firstname = document.getElementById("tdFirstname").firstChild.firstChild.nodeValue;
        var lastname = document.getElementById("tdLastname").firstChild.firstChild.nodeValue;
        var username = document.getElementById("tdUsername").innerHTML = firstname + lastname;
      }
    </script>
  </head>
  <body>
    <table id = 'confirm'>
      <tr>
        <th>Firstname</th>
        <td id = 'tdFirstname'>
          <div onkeypress = 'updateUsername()' contentEditable>
            Johnny
          </div>
        </td>
      </tr>
      <tr>
        <th>Lastname</th>
        <td id = 'tdLastname'>
          <div onkeypress = 'updateUsername()' contentEditable>
            Sppleseed
          </div>
        </td>
      </tr>
      <tr>
        <th>Username</th>
        <td id = 'tdUsername'>
          JSPPLESEED
        </td>
      </tr>
    </table>
  </body>
</html>

コードは機能しますが (最初のイニシャルについてはまだ心配していません)、1 文字遅れています。新しい文字が入力された後は更新されません。つまり、姓をAppleseedに更新した場合(そうあるべきです)、1文字を変更しても効果はありません(ユーザー名はSppleseedのままです)が、2番目のキーを押すと、アップルシードに変更。私のコードに何か問題がありますか？または、新しいキャラクターが入力/削除された後に更新する必要があるものを見逃していましたか. これは非常にイライラします。

4

1 に答える 1

0

onkeyupの代わりに使ってみてくださいonkeypress。

keyup イベントは、「そのキーのデフォルト アクションが実行された後、ユーザーがキーを離したときに」発生します。

http://www.quirksmode.org/dom/events/keys.html

于 2013-02-11T17:50:11.977 に答える