A股上市公司传智教育(股票代码 003032)旗下技术交流社区北京昌平校区

 找回密码
 加入黑马

QQ登录

只需一步,快速开始

下面是代码,怎么点击修改按钮,弹出输入框,输入内容后,点击确定,然后下面的“淘宝”就变成其他的名称和链接。



  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4. <meta charset="utf-8">
  5. <title></title>

  6. <style>
  7. .box{
  8.     width:50%; margin-top:10%; margin:auto; padding:28px;
  9.     height:350px; border:1px #111 solid;
  10.     display:none;            /* 默认对话框隐藏 */
  11. }
  12. .box.show{display:block;}
  13. .box .x{ font-size:18px; text-align:right; display:block;}
  14. .box input{width:80%; font-size:18px; margin-top:18px;}
  15. </style>

  16. <script>  
  17.         function change(n){
  18.             document.getElementById('inputbox').style.display=n?'block':'none';     /* 点击按钮打开/关闭 对话框 */
  19.         }
  20.      </script>
  21. </head>
  22. <body>

  23. <div id="div1">
  24. <input type="button" onClick="change(1)" value="修改">
  25.         <table>
  26.             <tr>
  27.                 <td width="62"><a  target="_blank">淘宝</a></td>
  28.         <tr>
  29.                 <td><a  target="_blank">tmall</a></td>
  30.         </tr>
  31.         <tr>
  32.                 <td><a  target="_blank">jd</a></td>
  33.         </tr>
  34.         </tr>
  35.     </table>
  36. </div>
  37. <div id='inputbox' class="box">
  38.         <a class='x' href=''; onclick="change; return false;">关闭</a>
  39.         <p>新名称:</p><input type="text">
  40.         <p>新网址:</p><input type="text">
  41.         <input type="button" value="确定">
  42. </div>

  43. </body>
  44. </html>
复制代码


0 个回复

您需要登录后才可以回帖 登录 | 加入黑马