var.push并在html页面中显示我的新临时信息

时间:2016-02-22 08:12:07

标签: javascript jquery

var etat = {
    "outbox": [{
        "to": "90221F212A4200001AA",
        "date": "2016 01 12 20:15:42",
        "msg": "What are u doin ?." 
    }],
};

$("#b4").click(function() {
    etat.outbox.push({
        to: $("#@").text(),
        msg: $("#msg").text(),
        date:new Date()
    });
    var new ("#b2") = ("#b4");
});

我使用表单并从我的html中提交栏,我可以在其中写新信息和新电子邮件,但我无法显示临时新信息,我错过了代码......我怎么能这样做

2 个答案:

答案 0 :(得分:0)

我想你想要这样的东西;



var etat = {
	outbox: []
    }
$("#b4").click(function() {
    etat.outbox.push({
        to: $("#to").val(),
        msg: $("#msg").val(),
        date: new Date()
    });
    showMessages()
});
var output;
$("#new-messages").click(function() {
	showMessages()
});


function showMessages(){
	$("#to").val("");
    $("#msg").val("");
	output = "";
    etat.outbox.forEach(function(data){
    	output += "TO: " + data.to + "<br> Message: " + data.msg + " <br>Date: " + data.date + "<br><br>"
    });
    $("#output").html(output)
}
&#13;
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<label for="to">
    TO:
</label>
<input type="text" id="to">
<div>
    <label for="msg">
        Message
    </label>
        <textarea name="msg" id="msg" cols="30" rows="10"></textarea>
</div>
<button id="b4">
    SEND!
</button>
<div id="new-messages">
    Click to see messages
</div>

<div id="output">

</div>
&#13;
&#13;
&#13;

答案 1 :(得分:0)

如果必须绑定表格中的所有发件箱数据,可以使用 -

 <script>
    $(document).ready(function () {

        var etat = {
            "outbox": [{
                "to": "90221F212A4200001AA",
                "date": "2016 01 12 20:15:42",
                "msg": "What are u doin ?."
            }],
        };

        bindTable();    

        $("#b4").click(function () {
            etat.outbox.push({
                to: $("#to").val(),
                msg: $("#msg").val(),
                date: new Date()
            });
            bindTable();
        });

        function bindTable() {
            $("#tbl tbody").empty();
            etat.outbox.forEach(function (data) {

                $("#tbl").append("<tr><td>" + data.to + "</td><td>" + data.msg + "</td><td>" + data.date + "</td></tr>");
            });

        }

    });
</script>

 <input type="text" id="to" />
<input type="text" id="msg" />
<button type="button" id="b4">Submit</button>
<table id="tbl" border="1">
    <th>To</th>
     <th>From</th>
     <th>Msg</th>
</table>

它会在表格中显示您的发件箱的所有数据,并在您的发件箱中添加新对象时附加新数据