未捕獲的 ReferenceError：fn_get_data_oneid 未在 HTMLDivElement.onclick 中定義

Question

我是 firebase 和 Javascript 的新手

我正在嘗試使用一個 onclick 函數，該函數應該指向我更改文本框值的其他 javascript 函數。（用於修改）

但是有一個錯誤

錯誤 -> 未捕獲的 ReferenceError: fn_get_data_oneid 未在 HTMLDivElement.onclick 中定義

請告訴我解決方案..

 var auth; var db; var userInfo; var userInfo; var name; var selectedKey; $(document).ready(function() { auth = firebase.auth(); db = firebase.database(); userInfo = firebase.auth().currentUser; userSessionCheck(); diaryList(); function diaryList(){ var diary_Ref = db.ref('Diary/'); diary_Ref.on('child_added', on_diary_list); } function on_diary_list(data){ var key = data.key; var Data = data.val(); var contents = Data.contents; var title = Data.title; var name = Data.name; console.log(data.key); if(name == userInfo.displayName){ var html = "<div id='" + key + "' onclick=\\"fn_get_data_oneid(this.id);\\" >" + '<div class="user_diary" style="float:left">' + '<ion-icon name="create" style="vertical-align: middle; margin-left: 10px;"></ion-icon>' + '<span style="font-weight: bold; font-size: 17px;">' + name +'</span>' + '<span style="float:right; margin-right:10px;" id="del_diary" onclick="fn_delete_date('+key+');">delete</span>' + '<span style="float:right; margin-right:10px;" id="update_diary">update</span>' + '</div>' + '<div class="result_form" style="width: 70%; overflow: hidden; display: block; margin-bottom:30px; float: left">' + '<div class="left" id="title">' + '<h4 style="font-weight: bold; margin: 10px;">'+ '<ion-icon name="list"></ion-icon>' + title + '</h4>' + '</div>' + '<div class="left" style=" margin: 10px;">' + '<span style="margin: 10px 10px 10px 10px; float: left; width: 95%; font-size: 15px; display: inline-block; padding-left:7px;">' + contents + '</span>' + '</div>' + '</div>' + '</div>'; $('#diary_result').append(html); } else{ var html = '<div class="user_diary" style="background: #777; float: right">' + '<ion-icon name="create" style="vertical-align: middle; margin-left: 10px;"></ion-icon>' + '<span style="font-weight: bold; font-size: 17px;">' + name +'</span>' + '</div>' + '<div class="result_form" style="width: 70%; overflow: hidden; display: block; margin-bottom:30px; float: right">' + '<div class="left">' + '<h4 style="font-weight: bold; margin: 10px;">'+ '<ion-icon name="list"></ion-icon>' + title + '</h4>' + '</div>' + '<div class="left" style=" margin: 10px;">' + '<span style="margin: 10px 10px 10px 10px; float: left; width: 95%; font-size: 15px; display: inline-block; padding-left:7px;">' + contents + '</span>' + '</div>' + '</div>' ; $('#diary_result').append(html); } } function fn_get_data_oneid(key){ var diary_Ref = db.ref('Diary/' + key); diary_Ref.once('value').then(function(snapshot){ $('#d_contents').val(snapshot.val().contents); $('#d_subject').val(snapshot.val().title); }); } function fn_delete_date(key) { if (!confirm('delete?')) { return; } var diary_ref= db.ref('Diary/' + key); diary_ref.remove(); }; function save_data(){ var diary_Ref = db.ref('Diary/'); var contents = $('#d_contents').val(); // var name = displayName; var title = $("#d_subject").val(); if (contents === '' || contents===' ' || title === '' || title === ' '){ alert('title or contents == null'); return; } if(selectedKey) { diary_Ref = db.ref('Diary/' + selectedKey); diary_Ref.update({ 'contents' : contents, 'name' : name, 'title': title }); } else { var obj = { 'contents' : contents, 'name' : name, 'title': title }; diary_Ref.push(obj); } } // var t = document.getElementById('d_submit'); t.addEventListener('click', function(event){ save_data(); location.reload(); if(userInfo){ console.log('ok'); }else{ alert('x'); location.reload(); } }); // update window.fn_get_data_oneid = function (key) }); //

---

window.fn_get_data_oneid = function (key) <- 仍然有錯誤

在此處輸入圖片說明

Answer 1

fn_get_data_oneid在您的就緒函數中定義，但從屬性處理程序訪問函數需要它們是全局范圍的。

簡單的解決方法是將您的function fn_get_data_oneid(key)更改為window.fn_get_data_oneid = function (key) （從而將其放入全局范圍內）。

但是，您還應該考慮在結果元素中查找元素（例如通過 querySelector）並修改它們的屬性/內容，而不是像這樣將 HTML 拼接在一起。