• javascript实战演练,制作新按钮,‘新窗口打开网站’,点击打开新窗


    通过练习javascript中的document.write()输出展示;消息弹出框alert(字符串或变量);消息对话框confirm(str);用户交互的信息prompt(str1, str2);打开新窗口window.open([URL], [窗口名称], [参数字符串]);window.close();//关闭本窗口或者是<窗口对象>.close();//关闭指定的窗口的学习,下面根据要求测试:

    要求:

    1、新窗口打开时弹出确认框,是否打开

    提示: 使用 if 判断确认框是否点击了确定,如点击弹出输入对话框,否则没有任何操作。

    2、通过输入对话框,确定打开的网址,默认为 https://www.cnblogs.com/dhnblog/

    3、打开的窗口要求,宽400像素,高500像素,无菜单栏、无工具栏。

    个人代码展示:

     1 <!DOCTYPE html>
     2 <html>
     3     <head>
     4         <meta charset="utf-8">
     5         <title>编程练习挑战</title>
     6         <script type="text/javascript">
     7         function rec(){
     8             // var ceshi=confirm("新窗口打开时弹出确认框,是否打开")
     9             var ceshi=prompt('新窗口打开时弹出确认框,是否打开','https://www.cnblogs.com/dhnblog/');
    10             if(ceshi!=null){
    11                 window.open('https://www.cnblogs.com/dhnblog/','_blank','width=400px,height=500px,menubar=no,toolbar=no')
    12             }
    13             else{
    14                 document.write('haode')
    15             }
    16         }
    17         </script>
    18     </head>
    19     <body>
    20         <input type="button" name="" id="" value="新窗口打开网站" onclick="rec()"/>
    21     </body>
    22 </html>

     正确代码展示:

     1 <!DOCTYPE html>
     2 <html>
     3     <head>
     4         <meta charset="utf-8">
     5         <title>浏览器对象</title>
     6         <script type="text/javascript">
     7             function ceshi(){
     8                 if(confirm('确定打开新窗口吗'))
     9                 {
    10                     var url=prompt('请输入一个网址','https://www.baidu.com/');
    11                     window.onpen(url,'_blank','toolbar=no,menubar=no,scrollbars=yes,width=400,height=400');
    12                 }
    13             }
    14         </script>
    15     </head>
    16     <body>
    17         <input type="button" name="" id="" value="新窗口打开网站" onclick="ceshi()" />
    18     </body>
    19 </html>
  • 相关阅读:
    Ftp、Ftps与Sftp之间的区别
    Previous Workflow Versions in Nintex Workflow
    Span<T>
    .NET Core 2.0及.NET Standard 2.0 Description
    Announcing Windows Template Studio in UWP
    安装.Net Standard 2.0, Impressive
    SQL 给视图赋权限
    Visual Studio for Mac中的ASP.NET Core
    How the Microsoft Bot Framework Changed Where My Friends and I Eat: Part 1
    用于Azure功能的Visual Studio 2017工具
  • 原文地址:https://www.cnblogs.com/webaction/p/12495516.html
Copyright © 2020-2023  润新知