Question

我是JavaScript的新手，我想知道从两个字段中获取一些文本。用户点击确认后。文本打印在结果部分。它没有像我预期的那样工作。确认后，您应该刷新页面一次，这是第二次有效！

var personalInfo = {
  firsName: document.getElementById("name").value,
  familyName: document.getElementById("family").value,
  confirm: function confirm() {
    document.getElementById("show-name").innerHTML = personalInfo.firsName;
    document.getElementById("show-family").innerHTML = personalInfo.familyName;
  }
}

<div> Basic Information</div>
<table>
  <tr>
    <td>First Name</td>
    <td><input type="text" id="name"></td>
    <td>Family Name</td>
    <td><input type="text" id="family"></td>
  </tr>
</table>
<button type="button" onclick="personalInfo.confirm()">Confirm</button>
<br><br><br><br><br><br><br><br><br>
<hr>
<div> Result!</div>
<table>
  <tr>
    <td>Name & Family name:</td>
    <td><span id="show-name"></span> <span id="show-family"></span></td>
  </tr>
</table>

Answer 1

在您当前的代码中，当您声明 personalInfo.firstName变量时，personalInfo.familyName和personalInfo会设置为DOM元素的值。您应该使用在按下按钮时获取DOM元素值的函数替换它们（当personalInfo.confirm()运行时）：

＆＃13;
＆＃13;
var personalInfo = { firstName: function () {return document.getElementById("name").value}, familyName: function () {return document.getElementById("family").value}, confirm: function() { document.getElementById("show-name").innerHTML = personalInfo.firstName(); document.getElementById("show-family").innerHTML = personalInfo.familyName(); } }
＆＃13;
<div> Basic Information</div> <table> <tr> <td>First Name</td> <td><input type="text" id="name"></td> <td>Family Name</td> <td><input type="text" id="family"></td> </tr> </table> <button type="button" onclick="personalInfo.confirm()">Confirm</button> <br> <hr> <h3> Result:</h3> <div>Name: <span id="show-name"></span></div> <div>Family name: <span id="show-family"></span></div>
＆＃13;
＆＃13;
＆＃13;

无法通过DOM获取文本drom输入标记

1 个答案: