为什么它在文本区域中两次显示空值?

时间:2019-04-01 01:13:12

标签: javascript jquery html firebase firebase-realtime-database

当我输入标题时,即使它在那里也显示为null。文本区域也会显示两次。谢谢您的帮助,不胜感激。我觉得我需要将其转换为实际读取的内容,但我只是一个初学者。

我尝试将其解析为JSON,但随时向我展示如何正确完成。

对不起,我的英语

var title_s = document.getElementById("TitleSearch");
var titlejson = JSON.parse(title_s);
var teststring = "test";
//This is to intialize everything and auth. with the firebase server
var config = {
        apiKey: "AIzaSyB9p1VvVfhnbrcDwUKUuSqw9aQsqnDi4nQ",
        authDomain: "html5project-870df.firebaseapp.com",
        databaseURL: "https://html5project-870df.firebaseio.com",
        projectId: "html5project-870df",
        storageBucket: "html5project-870df.appspot.com",
        messagingSenderId: "54935462861"
      };
//firebase.initializeApp(config);
//checks if it has been init
if (!firebase.apps.length) {
    firebase.initializeApp({});
}
//declare variables
var database = firebase.database();
//tells where the items are going to be 
var Rootref = database.ref().child("users");
var ref = firebase.database().ref("users");

ref.on("value", function(snapshot) {
   console.log(snapshot.val());
}, function (error) {
   console.log("Error: " + error.code);
});
//var Rootref1 = database.ref().child("users").child("id: 113295907411766134791")/*.child("trans")*/;

//used to retrieve data 
Rootref.on("child_added",snap => { 
    //gets the child of titles stores it as variable
  var transcript_title = snap.child("titles").val();
    //var transcript_title = (snap.val() && snap.val().titles);
    //gets the actual title and stores it as a var
    //var transcript = snap.child(transcript_title).val();

  $('#transcrip').val(snap.child('users/id: 107621796826103613669'))
    //jquery - way to add html elemnts with javascript

     snap.child("titles").forEach(function(titleSnap) {
  $("#read").append('<h4 id = "clicked">'+titleSnap.val()+'</h4>');
})
  console.log(teststring);
  $( "#TitleButton" ).click(function() {
     var search = snap.child(title_s).val();


  $("#ReadHere").append('<textarea placeholder="Shows up right here" col="50" row="10">'+search+'</textarea>');




  });
        //$("#read").append('<h4 >Test</h4>');

    //when button view was clicked it will show the transcriptiodn






 });
<!DOCTYPE html>
<html>
  <head>
    <!--Calling every thing required-->
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
    <meta name="google-signin-scope" content="profile email">
    <meta name="google-signin-client_id" content="54935462861-sedlkvk3ufqujgpo2hmevectur8p4o2u.apps.googleusercontent.com">
    <script src="https://apis.google.com/js/platform.js" async defer></script>
    <script src="https://www.gstatic.com/firebasejs/5.8.4/firebase.js"></script>
    <script>


      // Initialize Firebase
      var config = {
        apiKey: "AIzaSyB9p1VvVfhnbrcDwUKUuSqw9aQsqnDi4nQ",
        authDomain: "html5project-870df.firebaseapp.com",
        databaseURL: "https://html5project-870df.firebaseio.com",
        projectId: "html5project-870df",
        storageBucket: "html5project-870df.appspot.com",
        messagingSenderId: "54935462861"
      };
      firebase.initializeApp(config);
    </script>
    <!--Title on top left-->

    <h1>View your Transcriptions</h1>

    <link href="style.css" rel="stylesheet" type="text/css" />
    <script type="text/javascript" src="read.js"></script>

  </head>
  <body>
    <input type="text" id="TitleSearch">
    <button id = "TitleButton">Search</button>
    <center>

    <ul id="read">

    </ul>
   </center>
   <div id = "ReadHere">
  </div>

   <!--When clicked on you view it here-->
   <h1>Viewed Right Here</h1>
   <p id = "transcrip"></p>   
  </body>
</html>
{
  "users" : {
    "id: 110753432956858279660" : {
      "Test" : "He",
      "Test2" : "He",
      "titles" : {
        "201920201828" : "Test",
        "201920202259" : "Test2"
      }
    },
    "id: 113295907411766134791" : {
      "test" : {
        "text" : "text"
      },
      "test3" : {
        "text" : "text"
      }
    }
  }
}

0 个答案:

没有答案
相关问题