Question

我创建了两个页面，一个带有文本框，用于输入应存储在Firebase中的数据，另一个用于显示存储的数据，但我遇到的问题是某些数据未存储，而且没有数据显示在第二页上。文本框的HTML如下：

    <form>
        <div class="post-title">
            <input type="text" placeholder="Post Title">
        </div>
        <div class="post-content">
            <textarea type="text" placeholder="Post Content"></textarea>
        </div>
        <button type="submit" class="submit">Submit</button>
    </form>

应显示数据的页面的HTML是：

    <div class="result">
        <h4 class="postTitle">Paragraph 1</h4>
            <p class="postContent">Welcome to my test blog. This is a paragraph.</p>
            <div class="postDate">
                <p>Date of post: </p>
                <p class="postDate2">date</p>
            </div>
    </div>

应将文本框中的数据传输到我的Firebase的JavaScript：

    var url = "https://blog-posts.firebaseio.com/";
    var firebaseRef = new Firebase(url);

    function funct1(event)
    {
        var title = $("#post-title").text();
        var post = $("#post-content").text();
        var date = Date();
        firebaseRef.push({Title: title, Content: post, Date: date});
        event.preventDefault();
    }

    var submit = document.getElementsByTagName('button')[0];

    submit.onclick = funct1;

应该从我的Firebase检索数据并显示它的javascript（注意，两个javascript提取都来自相同的.js文件，我将它们分开以便于阅读）：

    firebaseRef.on('child_added', function(snapshot) {
var message = snapshot.val();
    });

    $("postTitle").replaceWith(title);
    $("postContent").replaceWith(post);
    $("postDate2").replaceWith(date);

日期/时间似乎会复制到我的Firebase，但如果我在任一文本框中输入内容并单击“提交”，则数据不会存储在我的Firebase中。此外，在应显示数据的页面上也不包括日期/时间。

Answer 1

我认为你的问题在这里可能相当直接。

将表单HTML更新为此 -

<form>
        <div class="post-title">
            <input id="post-title" type="text" placeholder="Post Title">
        </div>
        <div class="post-content">
            <textarea id="post-content" type="text" placeholder="Post Content"></textarea>
        </div>
        <button type="submit" class="submit">Submit</button>
    </form>

您有以下内容 -

    var title = $("#post-title").text();
    var post = $("#post-content").text();

更改为

    var title = $("#post-title").val();
    var post = $("#post-content").val();

看起来你也是jquery的新手，所以你可能还想阅读this来帮助你理解如何获取值，并使用选择器等。

希望这有帮助！

麻烦将数据从文本框传输到Firebase并显示该数据

1 个答案: