如何显示日期与文本框值
Jquery: How to show date with textbox value?
我是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"
只需使用适当的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/
就用这个:
var fullDate = new Date();
$('#date').text(fullDate);
$(function() {
$("#Get").click(function() {
var fullDate = new Date();
$('#date').text(fullDate);
$('#msg').text($('#comment').val());
});
});
<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>
相关文章:
- jquery日期选择器显示与值不同的文本
- 用Javascript重新格式化复杂文本日期字符串的更好方法
- 如何使用Windows8JSON.parse将JSON文本反序列化为日期类型
- 更改html标记或其子标记(而不是其属性)文本中的日期格式
- 如何使文本、数字和日期html输入字段以一致的方式支持Ctrl+Z(撤消)
- 引导日期选取器不适用于文本框 asp.net
- 当用户在文本框中输入日期时,如何计算一年的持续时间
- jQuery 验证输入文本是否仅接受数字、单词或日期
- jQuery UI日期选择器只响应第一个文本框
- 将“日期”设置为Jquery UI日期选择器输入文本框
- 单击按钮可多次动态添加选择框、文本框和日期,并将这些值插入数据库
- 如何从html文本框中获取选定的日期是日期
- 如何使用javascript将验证日期设置为不小于文本框中的开始日期
- 文本框值在从 Jquery 日期选择器中选择日期后不会发布
- 允许日期选择器使用文本输入字段
- 将日期选择器动态添加到文本框中
- 使用javascript将日期格式设置为文本框
- 如何在 Javascript 中解析非英语文本日期
- 显示选择选项文本日期
- 将数字日期转换为文本日期的效率