为什么取消设置弹窗后点击取消仍然会初始化设置?

来源:4-1 编程挑战

lllmh

2018-08-01 15:07

<!DOCTYPE HTML>

<html>

<head>

<meta http-equiv="Content-Type" Content="text/html; charset=utf-8" />

<title>javascript</title>

<style type="text/css">

body{font-size:12px;}

#txt{

    height:400px;

    width:600px;

border:#333 solid 1px;

padding:5px;}

p{

line-height:18px;

text-indent:2em;}

</style>

</head>

<body>

  <h2 id="con">JavaScript课程</H2>

  <div id="txt"> 

     <h5>JavaScript为网页添加动态效果并实现与用户交互的功能。</h5>

        <p>1. JavaScript入门篇,让不懂JS的你,快速了解JS。</p>

        <p>2. JavaScript进阶篇,让你掌握JS的基础语法、函数、数组、事件、内置对象、BOM浏览器、DOM操作。</p>

        <p>3. 学完以上两门基础课后,在深入学习JavaScript的变量作用域、事件、对象、运动、cookie、正则表达式、ajax等课程。</p>

  </div>

  <form>

  <!--当点击相应按钮,执行相应操作,为按钮添加相应事件-->

    <input type="button" value="改变颜色" onclick="changecolor()">  

    <input type="button" value="改变宽高" onclick="changesize()">

    <input type="button" value="隐藏内容" onclick="hidetxt()">

    <input type="button" value="显示内容" onclick="showtxt()">

    <input type="button" value="取消设置" onclick="cancelset()">

  </form>

  <script type="text/javascript">

  var my=document.getElementById("txt");

  var me=document.getElementById("con");

  //定义"改变颜色"的函数

  function changecolor(){

  my.style.color="red";

 my.style.backgroundColor="black";}

  //定义"改变宽高"的函数

  function changesize(){

  my.style.width="300px";

  my.style.height="300px";}

//定义"隐藏内容"的函数

function hidetxt(){

my.style.display="none";    }

//定义"显示内容"的函数

function showtxt(){

    my.style.display="block";

}

//定义"取消设置"的函数

function cancelset(){

    var Cancelset=confirm("Sure for cancle setting?");

    if (Cancelset=true)

    {

    txt.removeAttribute("style");

}

else{}

}

  </script>

</body>

</html>


写回答 关注

7回答

  • 箫风凉月
    2018-08-01 17:09:36

    if(confirm("确定要取消设置吗?"))这句将那两句合成一句挺好的。O(∩_∩)O哈哈~

  • 箫风凉月
    2018-08-01 17:05:52

    function quxiao(){
        var message=confirm("确认要取消设置吗?");
        if(message==true){
            var message=document.getElementById("txt")
            message.removeAttribute("style");
            var message=document.getElementById("con")
             message.removeAttribute("style");
        }
    }

    你上面的那种我没试过,应该也可以,只是又要找回原来的样式,我这种也能实现它的功能,刚刚又修改了一下,它能同时取消两个ID的设置,没改前只能取消一个,你可以试一下我这种,我觉得简短一点

    qq_宁子_...

    为什么我用你的方法没有效果,反而上面的按钮都没有显示出效果来?

    2018-08-15 21:59:31

    共 2 条回复 >

  • qq_阳光透过指间_0
    2018-08-01 16:56:16

    答案里是这么写的;

    function dclear(){

    if(confirm("确定要取消设置吗?")){

    var mychar = document.getElementById("txt");  

    mychar.style.color="#000";

    mychar.style.backgroundColor="#fff";

    mychar.style.width="600px";

    mychar.style.height="400px";

    mychar.style.display="block";

    }

    }


    lllmh

    这样写有点麻烦阿,需要逐个写属性,只要还原原始设置就好了。

    2018-08-02 17:40:01

    共 1 条回复 >

  • 箫风凉月
    2018-08-01 16:55:54

    还有哦,你的txt.removeAttribute("style");前还需加上var Cancelset=document.getElementById("txt"); 先获取这个元素的信息,上面的cancel打错了,不好意思。这些是我刚刚百度然后实践出来的

    慕仔9193... 回复lllmh

    OK了 是我自己的代码问题

    2018-08-03 18:27:38

    共 4 条回复 >

  • 箫风凉月
    2018-08-01 16:49:39

    你的取消设置那里的条件少了个“=”号,应该是if(Cancleset==true)

    我告诉你啊

    正确答案没人看?

    2018-08-04 16:13:01

    共 1 条回复 >

  • qq_阳光透过指间_0
    2018-08-01 16:41:46

    把 txt.removeAttribute("style");改成txt.reset();就好了


    lllmh

    txt.reset()不起作用

    2018-08-02 16:58:52

    共 1 条回复 >

  • 慕设计9004528
    2018-08-01 16:16:12

    你在if语句里只给他设置了确定之后应该如何,没有给他设定取消之后要怎么办。设个返回就好。

    慕设计900... 回复lllmh

    var d = confirm("确定取消吗?") if (d == true) { txt.removeAttribute("style"); } else{ document.getElementById("txt"); } } 额.....我是这么写的最后的那个if语句,方法有点笨,但是结果是OK的。

    2018-08-03 16:07:06

    共 2 条回复 >

JavaScript入门篇

JavaScript做为一名Web工程师的必备技术,本教程让您快速入门

739838 学习 · 9566 问题

查看课程

相似问题