Question

我一直在尝试更新用户可以随时更新的个人资料信息。我正在显示他们的个人资料信息，并允许他们使用contenteditable更新该信息，但是我似乎无法在Firebase中更新该信息。

基本HTML：

<div class="white-container bottom-padding-fortypx container container-about margin-top-eightypx">

    <h6 class="margin-top-eightypx">company</h6>
    <h4 id="companyName" contenteditable="true"></h4>

    <h6>username</h6>
    <h4 id="username"></h4>

 </div>

JS：

firebase.auth().onAuthStateChanged((user) => {

  var userId = firebase.auth().currentUser.uid;
  firebase.database().ref('/users/' + userId).once('value').then(function(snapshot) {
    $('#companyName').append('<p>' + snapshot.val().businessName + '</p>');
    $('#username').append('<p>' + snapshot.val().businessAddress + '</p>');
    $('#companyAddress').append('<p>' + snapshot.val().state + '</p>');

    var updatedInfo = document.getElementById('companyName');
    updatedInfo = updatedInfo.innerText;
    console.log(updatedInfo);

    var db = firebase.database();
    $('[contenteditable]').on('keypress focusout', function(en) {
      var currentUser = firebase.auth().currentUser;
      db.ref('users' + currentUser.uid).update({'businessName': updatedInfo});
    })
  });
})

如您所见，当用户单击focusout字段后，contenteditable事件发生后，我试图更新内容，但是，Firebase中没有更新。有人知道我在做什么错吗？

Answer 1

经过一些解决后，我能够针对以上问题提出解决方案（对我的HTML不变）：

Javascript：

document.getElementById('name').addEventListener('focusout', function(e) {
   var updated = document.getElementById('name').value = this.innerText;
   // Getting rid of the new line characters, twice.
   if (updated[updated.length - 1] === '\n')
     updated = updated.slice(0, -2);
   // Pushing the updated profile information to their firebase profile
   db.ref('users/' + userId).update({
     'businessName': updated
   });
});

我在'users'之后添加了一个/，Frank给出了建议，但有帮助，但是将contentTestable与innerTest结合使用时，增加了两个换行符，因此，我使用此代码段来消除了这些代码：

if (updated[updated.length - 1] === '\n')
  updated = updated.slice(0, -2);

现在，直到我将'.on'更改为'.addEventListener'并稍微修改一下代码，实际值仍未更新为新值。

使用contenteditable更新关于焦点的Firebase信息

1 个答案: