JavaScript实现点击按钮弹出输入框，点确定后添加li组件到ul组件里

<!doctype html>

<html manifest="lab4.manifest">

<head>

<title>Mobile Cookbook</title>

<meta charset="utf-8">

<meta name="viewport" content="width=device-width, initial-scale=1.0">

</head>

<body >

  <section>

    <form id="form1" name="form1" method="post">

      <input type="button" name="button"  onClick="inputBox();"id="button" value="Add Note" />

      <ul id="ul">

     <li>metting</li>

        <li>读书</li>

        <li>打代码</li>

        <li>看代码</li>

        <li>看博客</li>

      </ul>

    </form>

    <div></div>

 <script language="javascript">

 function inputBox()

 {

  var str=prompt("您的备忘录^-^","");

  if(str!=null&&str!="")

  {

   var ul = document.getElementById("ul");

      var num = ul.childNodes.length;

   add(1,str);

   alert("^-^添加成功,您刚输入的是："+ str)

  }

 }

 function add(n,str){

  var ul = document.getElementById('ul');

  var li = document.createElement("li");

  var num = ul.childNodes.length;

  li.innerHTML=str;

  for(var i=0;i<num;i++){

   if(n==-1){

    ul.appendChild(li);

   }else if(i==n-1){

    ul.insertBefore(li,ul.childNodes[i]);

   }

  }

 }

</script>

  </section>

</body>

</html>

JavaScript实现点击按钮弹出输入框，点确定后添加li组件到ul组件里的更多相关文章

  1. Html ： 点击按钮弹出输入框，再次点击进行隐藏

    上代码: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3 ...

  2. 请写出一段JavaScript代码，要求页面有一个按钮，点击按钮弹出确认框。程序可以判断出用

    请写出一段JavaScript代码,要求页面有一个按钮,点击按钮弹出确认框.程序可以判断出用 户点击的是“确认”还是“取消”. 解答: <HTML> <HEAD> <TI ...

  3. ExtJs 4.2.1 点击按钮弹出表单的窗口

    初学ExtJs,做项目的时候想做一个这样的效果:点击按钮弹出对话框,之前一直是使用EasyUi来做的, EasyUi里有Dialog,用起来很方便,但是现在转移到ExtJs上后,发现没有Dialog这 ...

  4. jquery点击按钮弹出图片

    <!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8" ...

  5. jquery实现点击按钮弹出层和点击空白处隐藏层

    昨天做项目遇到一个问题,和大家分享下,jquery实现点击按钮弹出层和点击空白处隐藏层的问题 if($('.autoBtn').length){                $('.autoBtn' ...

  6. ASP.NET点击按钮弹出确认对话框方法

    开发asp.net网页应用程序的时候,有些页面的按钮需要增加一个确认对话框,比如: 实现这个功能比较简单,代码这样写: Button.Attributes["onclick"] = ...

  7. Asp.net点击按钮弹出文件夹选择框的实现（网页）

    本文地址:http://www.cnblogs.com/PiaoMiaoGongZi/p/4092112.html 在Asp.net网站实际的开发中,比如:需要实现点击一个类似于FileUpload的 ...

  8. 点击按钮弹出一个div层

    JQuery弹出层,点击按钮后弹出遮罩层,还有关闭按钮 <!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml& ...

  9. js实现点击按钮弹出上传文件的窗口

    转自:https://www.jb51.net/article/100916.htm 1.详细描述 在页面上设置一个“选择文件”按钮,点击该按钮,会弹出本地磁盘信息用于选择文件. 2.代码 ? 1 2 ...

随机推荐

  1. 修改 suse 上的postfix 的日志路径

    刚刚搭建的邮件服务器,没过多久硬盘就爆满了,不得已移动存储,包括日志. 移动存储灰常简单,查找 /etc/postfix/main.cf 中的 data_directory / base_direct ...

  2. C#-创建自定义双击事件

    .NET Compact Framework 不支持按钮的 Windows 窗体 DoubleClick 事件.但是您可以创建一个从 Button 类派生的控件来实现该事件. 创建自定义双击事件 创建 ...

  3. 让DataGridView显示行号

          http://www.cnblogs.com/JuneZhang/archive/2011/11/21/2257630.html 为了表示行号,我们可以在DataGridView的RowP ...

  4. Matlab画图-非常具体，非常全面

    Matlab画图 强大的画图功能是Matlab的特点之中的一个,Matlab提供了一系列的画图函数,用户不须要过多的考虑画图的细节,仅仅须要给出一些基本參数就能得到所需图形,这类函数称为高层画图函数. ...

  5. MySQL HA

    读写分离 在应用端处理 Spring AbstractRoutingDataSource 淘宝MyFox MySQL Replication Connection 在数据库端处理 MySQL Prox ...

  6. 06---Java基础、面向对象

    一.Java基础 1.Java概述 Java语言特点:                     简单性.解释性.面向对象.高性能.分布式处理                     多线程.健壮性.动 ...

  7. iOS开发——开发技巧&Mac常用命令

    现实和隐藏文件拓展名 显示:defaults write com.apple.finder AppleShowAllFiles Yes && killall Finder 隐藏:def ...

  8. CCS5 建立SYS/BIOS工程时报错“cannot find file "./configPkg/linker.cmd" bios”的解决方法

    CCS5 建立SYS/BIOS工程时报错“cannot find file "./configPkg/linker.cmd" bios”的解决方法 报错 #10008-D cann ...

  9. 微信、微博、qq图标服务实现

    实现原理:变化前的图标和变化后的图标在一张图片上,用这张图片作为背景,通过定义背景的位置来实现显示哪个图标,其中还带着滑动的动画效果. <!DOCTYPE html> <html l ...

  10. matlab——sparse函数和full函数（稀疏矩阵和非稀疏矩阵转换）

    函数功能:生成稀疏矩阵 使用方法 :S = sparse(A) 将矩阵A转化为稀疏矩阵形式,即矩阵A中任何0元素被去除,非零元素及其下标组成矩阵S.如果A本身是稀疏的,sparse(S)返回S. S ...