js随意写的一个tab选项卡，VS中调试各种有关问题

2013-11-09

js随意写的一个tab选项卡，VS中调试各种问题前台aspx代码：%@ Page LanguageC# AutoEventWireuptrue

js随意写的一个tab选项卡，VS中调试各种问题
前台aspx代码：

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Manage.aspx.cs" Inherits="Manage_Manage" %>
<script language="javascript" src="../Js/iframe.js"  type="text/javascript"></script>
<!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 runat="server">
<title></title>
</head>
<body>
    <form id="form1" runat="server">
    <table style="border-width: 0.5px; border-style: groove; width:100%; height:auto">
        <tr>
            <td style="width:200px;text-align:left; vertical-align:top">
                <div id="noticediv" style="background-color: #666666;border-color: #C0C0C0; border-width: 1px; height:50px; border-top-style: groove; border-bottom-style: groove; border-left-style: groove;text-align:center; padding-top:16px; color:White;" 
                    onclick='tabclick(["noticediv","userdiv","setdiv"],0);'>公&nbsp; 告</div>
                <div id="userdiv" style="background-color: #666666;border-color: #C0C0C0; border-width: 1px; height:50px; border-top-style: groove; border-bottom-style: groove; border-left-style: groove;text-align:center;padding-top:16px; color:White;"
                    onclick='tabclick(["noticediv","userdiv","setdiv"],1);'>用&nbsp; 户</div>
                <div id="setdiv" style="background-color: #666666;border-color: #C0C0C0; border-width: 1px; height:50px; border-top-style: groove; border-bottom-style: groove; border-left-style: groove; text-align:center;padding-top:16px; color:White;"
                    onclick='tabclick(["noticediv","userdiv","setdiv"],2);'>设&nbsp; 定</div>
            </td>
            <td style="min-height:300px; text-align:left; vertical-align:top; height:100%">
                <iframe id="showframe" scrolling="auto" onload='autoframe("showframe");' frameborder="0" marginheight="0" marginwidth="0" width="100%" height="100%" src=""></iframe>
            </td>
        </tr>
    </table>
    </form>
</body>
</html>

调用的js中：

function tabclick(tabs, stab) {
    var tem;
    for (i = 0; i < tabs.length; i++) 
    {
        tem = document.getElementById(tabs[i]);
        if (tem) 
        {
            if (i != stab) 
            {
                tem.style.backgroundColor = "#666666";
                tem.style.color = "white";
            }
            else 
            {
                tem.style.backgroundColor = "white";
                tem.style.color = "#666666";
            }
        }
    }
}

VS中调试的时候遍历tabs这个数组时，判断是否为当前点击的选项卡时总是无法正常判断，而且每次都会更改tabs数组元素。
但是把tabclick这个函数复制出来，前台html一起写在一个html页里时，又很正常？
为什么VS中调试js这么不稳定？

javascript 遍历

[解决办法]
是不是编码问题？
[解决办法]
改成这样用试试：


  function tabclick(dom) {
             var tb=dom.parentElement;
            var tabs=tb.children;
            for(var i=0;i<tabs.length;i++){
                var d=tabs[i];
                d.style.backgroundColor = "#666666";
                d.style.color = "white";
            }

            dom.style.color = "#666666";
            dom.style.backgroundColor = "white";
        }

 <td style="width:200px;text-align:left; vertical-align:top">
                <div id="noticediv" style="background-color: #666666;border-color: #C0C0C0; border-width: 1px; height:50px; border-top-style: groove; border-bottom-style: groove; border-left-style: groove;text-align:center; padding-top:16px; color:White;"
                     onclick="tabclick(this);">公&nbsp; 告</div>
                <div id="userdiv" style="background-color: #666666;border-color: #C0C0C0; border-width: 1px; height:50px; border-top-style: groove; border-bottom-style: groove; border-left-style: groove;text-align:center;padding-top:16px; color:White;"
                     onclick="tabclick(this);">用&nbsp; 户</div>
                <div id="setdiv" style="background-color: #666666;border-color: #C0C0C0; border-width: 1px; height:50px; border-top-style: groove; border-bottom-style: groove; border-left-style: groove; text-align:center;padding-top:16px; color:White;"
                     onclick="tabclick(this);">设&nbsp; 定</div>
            </td>

[解决办法]

引用:

Quote: 引用:

Quote: 引用:

Quote: 引用:

是不是编码问题？
我也觉得是编码的问题，那该怎么改呢？

你先看是不是编码问题，js里面写个中文你看乱码没得。
乱码了就你得统一编码了...

好吧，的确是编码的问题，我重新新建了个文本文档，把js复制进去另存为utf-8编码的js文件，替换了原来那个VS自动生成的，就正常了。

My God!

热点排行

JavaScript

js随意写的一个tab选项卡，VS中调试各种有关问题