Jquery:如何用文本框值显示日期?

时间:2016-06-28 10:35:21

标签: javascript jquery html

我是jquery的新手,我在下面写了代码

<h1>Type your comment below </h1>
<h2>TextBox value : <label id="msg"></label>-<label id="date"></label></h2>
<div style="padding:16px;">
    TextBox : <input type="text" value="" placeholder="Type Your Comment"></input>
</div>
<button id="Get">Get TextBox Value</button> 
var fullDate = new Date();
$("button").click(function(){
    $('#msg').html($('input:text').val());        
}); 

如何在标签的提交按钮按下时显示日期id="date"? 当用户按下提交按钮我想显示

"User entered Textbox Value - Date with time"

2 个答案:

答案 0 :(得分:1)

只需使用适当的css选择器即可添加消息和日期。请参考以下代码:

 $("button").click(function() {
    var msg = $('input:text').val();
    var fullDate = new Date();

    $('#msg').html(msg);
    $('#date').html(toLocal(fullDate));
  });

 function toJSONLocal (date) {
   var local = new Date(date);
   local.setMinutes(date.getMinutes() - date.getTimezoneOffset());
   return local.toJSON().slice(0, 10);
 }

 function toLocal (date) {
   var local = new Date(date);
   local.setMinutes(date.getMinutes() - date.getTimezoneOffset());
   return local.toJSON().replace('T', ' ').slice(0, 19);
 }

注意:toJSONLocal,toLocal用于格式化日期。

jsfiddle:https://jsfiddle.net/nikdtu/q8zmLebz/

答案 1 :(得分:0)

请使用:

var fullDate = new Date();
$('#date').text(fullDate);

&#13;
&#13;
$(function() {
  $("#Get").click(function() {
    var fullDate = new Date();
    $('#date').text(fullDate);
    $('#msg').text($('#comment').val());
  });
});
&#13;
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<h1>Type your comment below </h1>

<h2>TextBox value : <label id="msg"></label>-<label id="date"></label></h2>

<div style="padding:16px;">
  TextBox :
  <input type="text" value="" placeholder="Type Your Comment" id="comment" />
</div>

<button id="Get">Get TextBox Value</button>
&#13;
&#13;
&#13;