我想要输出用*组成的三角形,为什么不能在当前指定的div标签不能显示出来值

WBOY
發布: 2016-06-23 13:32:48
原創
1169 人瀏覽過




Document




请输入要显示的三角形的高度:



<script> <br /> // a总共的行数 document.getElementById("usernameTip").innerHTML="<font color=red>√ 请输入用户名"; <br /> function sanjiaoxing() { <br /> var a=document.getElementById("sanjiao").value; <br /> var number=a-0; <br /> // document.getElementById("sj").innerHTML=number; <br /> if(number==NaN){ <br /> <br /> document.getElementById("sj").innerHTML="此值不是数字,请输入数字"; <br /> return false; <br /> } <br /> else{ <br /> var n=1;// 第n行 <br /> <br /> for(;a>0;a--){ <br /> for(var b=1;b<a;b++){ <br /> document.getElementById("sj").innerHTML=" "; <br /> } <br /> <br /> for(var c=1;c<=2*n-1;c++){ <br /> document.getElementById("sj").innerHTML=" * "; <br /> } <br /> document.getElementById("sj").innerHTML=""; <br /> n++; <br /> } <br /> // document.write(""); <br /> // document.write(""); <br /> // a总共的行数 <br /> } <br /> } <br /> <br /> </script>



回复讨论(解决方案)

你每次都重新赋值,所以最后那个
覆盖了,应该不用= 而用 += 来连接。

            for(;a>0;a--){
                for(var b=1;b                     document.getElementById("sj").innerHTML  +="  ";
                }
                for(var c=1;c                     document.getElementById("sj").innerHTML +=" * ";
                }
                document.getElementById("sj").innerHTML +="";
                n++;    
            }

另外你检查是否数字那里有问题。

修改如下:

<html><head><meta charset="utf-8"><title>Document</title><style>input{width:50px;height:40px;}#sj{width:1000px;height: 40px;box-shadow:0 10px 40px  skyblue inset;}</style></head><body><div>请输入要显示的三角形的高度:<input type="text" id="sanjiao" name="sanjiao"  maxlength="3"/><input type="submit" value="提交" onclick="return sanjiaoxing()"/></div><div id="sj"></div><script type="text/javascript">    // a总共的行数  document.getElementById("usernameTip").innerHTML="<font color=red>√ 请输入用户名</font>";    function sanjiaoxing() {        var a=document.getElementById("sanjiao").value;        // document.getElementById("sj").innerHTML=number;        if(/^\d+$/.test(a)==false){            document.getElementById("sj").innerHTML="此值不是数字,请输入数字";            return false;        }else{            var n=1;// 第n行            document.getElementById("sj").innerHTML = "";            for(;a>0;a--){                for(var b=1;b<a;b++){                    document.getElementById("sj").innerHTML +="  ";                }                for(var c=1;c<=2*n-1;c++){                    document.getElementById("sj").innerHTML+=" * ";                }                document.getElementById("sj").innerHTML+="</br>";                n++;                }    // document.write("</br>");    // document.write("</br>");    // a总共的行数         }    }    </script></body></html>
登入後複製

來源:php.cn
本網站聲明
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn
熱門教學
更多>
最新下載
更多>
網站特效
網站源碼
網站素材
前端模板
關於我們 免責聲明 Sitemap
PHP中文網:公益線上PHP培訓,幫助PHP學習者快速成長!