document.write()在IE和chrome处理方式有什么不同？

本帖最后由 ren2881971 于 2012-05-23 18:16:19 编辑

解决方案 »

  1.   

    两个问题
    1. outPrint触发的document.write 是把页面清空了之后 再写的值
    2. form 触发submit之后,会刷新页面.解决
    把 document.write 改成 innerHTML 来显示
    type="submit" 换成 type="button"<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
    <html>
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=gbk">
    <title>Javascript控制页面布局</title>
    <script language="javascript">
    function checkSex( stype){    if(stype=="man"){
         document.getElementById("man").style.display="block";
         document.getElementById("miss").style.display="none";
            }
        if(stype=="miss"){
          document.getElementById("man").style.display="none";
          document.getElementById("miss").style.display="block";
            }
    }
    function confrimForm(){
        return confirm("是否确认提交数据？点【确定】提交，点【取消】放弃");
    }
    function getResult(){
        var sex1=document.getElementById("sex1").checked;
        var sex2=document.getElementById("sex2").checked;
        var yourmoney=document.getElementById("yourmoney").value;
        var yoursmoke=document.getElementById("yoursmoke").value;
        var yourdrink=document.getElementById("yourdrink").value;
        var yourbeautiful=document.getElementById("yourbeautiful").value;
        var yourbuy=document.getElementById("yourbuy").value;
        var result=0;
        if(sex1==true){
         result=yourmoney-yoursmoke-yourdrink;
            }
        if(sex2==true){
            result=yourmoney-yourbeautiful-yourbuy;
            }
        return result;
    }
    function outPrint( name,age,monkey,result){
        var str="您好"+name+"<br>"+"您现在"+age+"岁<br>您的月收入为"+monkey+"<br>"+
        "根据计算您的月结余为:"+result+"<br>谢谢";
       // document.write(str);
        document.getElementById('info').innerHTML = str;
        document.getElementById('form').style.display = 'none'
    }
    function mainClick(){
        var confirm=confrimForm();
        if(confirm==true){
          var yourname=document.getElementById("yourname").value;
          var yourage=document.getElementById("yourage").value;
          var yourmonkey=document.getElementById("yourmoney").value;
          var yourresult=getResult();
          outPrint(yourname,yourage,yourmonkey,yourresult);
            }
    }
    </script>
    </head>
    <body><form name="form1" id="form">
    性别：
    <input type="radio" id="sex1" name="sex" value="先生" onclick="checkSex('man');"/>男&nbsp;
    <input type="radio" id="sex2" name="sex" value="女士" onclick="checkSex('miss');"/>女<br>
    姓名：<br>
    <input type="text" id="yourname" name="yourname" /><br/>
    年龄:<br>
    <input type="text" id="yourage" name="yourage" /><br/>
    收入：<br>
    <input type="text" id="yourmoney" name="yourmoney"/><br/>
    <div id="man" style="display:none">
    月抽烟花费：<br>
    <input type="text" id="yoursmoke" name="yoursmoke"/><br/>
    月喝酒花费：<br>
    <input type="text" id="yourdrink" name="yourdrink" /><br/>
    </div>
    <div id="miss" style="display: none">
     月美容花费：<br/>
     <input type="text" id="yourbeautiful" name="yourbeautiful"/><br/>
     月购物花费：<br/>
     <input type="text" id="yourbuy" name="yourbuy"/><br/>
     </div>
    <input type="button" value="提交" onclick="mainClick();"/>
     <input type="reset" value="重填" /> 
    </form>
    <div id="info"></div>
    </body>
    </html>
      

  2.   


    哈哈 应该是form 中 点击submit   刷新页面的事。但是这位兄台你知道为什么在IE上 就可以显示呢？
      

  3.   

    DOM树加载完毕后再使用document.write()方法会创建新的文档并向文档流中输出内容。不过各浏览器的具体实现是不同的，比如下面的代码，除IE以外的浏览器都会执行alert('DEMO');这行代码，但IE很明显是创建了一个新的文档（查看源代码会发现源代码变成了write()方法输出的'DEMO'）。如果你只是要输出错误信息，建议使用alert()弹出对话框，或者使用DOM方法更新文档内容。<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>无标题文档</title>
    <script type="text/javascript">
    window.onload = function() {
    document.write('DEMO');
    alert('DEMO');
    }
    </script>
    </head><body>
    </body>
    </html>