zoukankan      html  css  js  c++  java
  • JavaScript实现点击按钮弹出输入框,点确定后添加li组件到ul组件里

    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>
  • 相关阅读:
    第二章 课后习题 6
    第二章 课后习题 5
    第一章 课后习题 10
    第一章 课后习题 7
    JAVA练习1
    作业2
    作业
    c++作业10月13日作业
    c++作业50页例题3.1
    for循环作业4和5
  • 原文地址:https://www.cnblogs.com/mzq123/p/4982619.html
Copyright © 2011-2022 走看看