jQuery最简单的留言功能^-^

简介: jQuery最简单的留言功能^-^

先上代码:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
<head>
  <meta http-equiv="Content-Type" content="text/html;charset=UTF-8">
  <title>留言功能</title>
  <script type="text/javascript" src="js/jquery-1.8.3.js"></script>
  <style type="text/css">
  </style>
  <script type="text/javascript">
    $(function(){
      $("#tijiao").click(function(){
        var name=$("#name").val();
        var info=$(".infos").val();
        var date=new Date();
        var year=date.getFullYear();
        var month=date.getMonth()+1;
        var day=date.getDate();
        var hour=date.getHours();
        var min=date.getMinutes();
        var secon=date.getSeconds();
        var riqi=year+"-"+month+"-"+day+" "+hour+":"+min+":"+secon
        var obj=("<li>昵称:"+name+" 内容:"+info+" 日期"+riqi+"</li><br/>");
        $("#ul1:last").append(obj);
      })
    })
  </script>
</head>
<body>
  <div id="menu">
  <p>昵称:<input type="text" id="name"></p>
  <p>内容:<textarea value="在这留言" style="width: 200px; height: 200px" class="infos">在这留言</textarea></p>
  <p><input type="button" value="提交" id="tijiao"></p>
  <p><h1>所有留言</h1></p>
  <ul id="ul1">
  </ul>
  </div>
</body>
</html>


   原理:在网页中提交的内容是把表单里面的值提取出来,然后显示到下面的指定div中

目录
相关文章
|
Linux 测试技术 开发工具
Linux的进程pid编号极限
整理本文,起源是看到知乎上的一个问题,为什么Linux的进程pid编号极限最大值( process pid max)是131070?
250 0
|
小程序 前端开发 算法
小程序实现个人支付功能
1.小程序的支付功能一直有人咨询 2.以前一直以为个人开发者是不可以使用支付功能的 3.但是微信自己有个骚操作 ,所以个人也可以使用小程序功能 4.下面介绍
1622 0
小程序实现个人支付功能
|
9月前
|
JavaScript
jQuery最简单的留言功能^-^
jQuery最简单的留言功能^-^
|
9月前
|
JavaScript 前端开发 API
jQuery 第一章(介绍)
jQuery 第一章(介绍)
53 2
|
XML Web App开发 JSON
Jquery 笔记(十一)
Jquery 笔记(十一)
|
SQL JavaScript PHP
学习jQuery笔记
学习jQuery笔记
74 0
|
JavaScript
jQuery入门第一章(jQuery初体验)
jQuery入门第一章(jQuery初体验)
117 0
jQuery入门第一章(jQuery初体验)
|
XML Java 数据格式
Spring 核心类 ConfigurationClassPostProcessor 流程讲解及源码全面分析(二)
Spring 核心类 ConfigurationClassPostProcessor 流程讲解及源码全面分析(二)
102 1
|
9月前
|
数据采集 开发框架 数据可视化
低代码还是好用的,我持有这个观念
低代码还是好用的,我持有这个观念
低代码还是好用的,我持有这个观念
|
机器学习/深度学习 弹性计算 人工智能
阿里云服务器ECS、轻量应用服务器和云虚拟主机的区别及对比
阿里云服务器ECS、轻量应用服务器和云虚拟主机的区别及对比