关于js计算和判断 操作html


<html>
<head>
    <title>This is a test!</title>
    <style type="text/css">
<!--
body,div,p,ul,li,font,span,td,th{
font-size:10pt;
line-height:155%;
}
table{
border-top-width: 1px;
border-right-width: 1px;
border-bottom-width: 0px;
border-left-width: 1px;
border-top-style: solid;
border-right-style: solid;
border-bottom-style: none;
border-left-style: solid;
border-top-color: #CCCCCC;
border-right-color: #CCCCCC;
border-bottom-color: #CCCCCC;
border-left-color: #CCCCCC;
}
td{
border-bottom-width: 1px;
border-bottom-style: solid;
border-bottom-color: #CCCCCC;
}
.EditCell_TextBox {
width: 90%;
border:1px solid #0099CC;
}
.EditCell_DropDownList {
width: 90%;
}
.colorfocus{
background-color:red
}
.txt{
background-color:#ccc}
-->
</style>
    <script src="../../JQuery/jquery.js" type="text/javascript"></script>
<script type="text/javascript">
    $(document).ready(function () {
        $("#tabProduct").each(function () {
            var trlen = $("#tabProduct tr").length;
            for (n = 0; n < trlen; n++) {
                $("#tabProduct tr").each(function () {
                    var a = $(this).children('td').eq(0).html() - 0;
                    var str = $(this).children('td').eq(1).html();
                    var b = $(this).children('td').eq(2).html() - 0;
                    var c = 0;
                    var len = $(this).children('td').length;
                    for (i = 0; i < len; i++) {                        c = $(this).children('td').eq(i).html() - 0;
                        if (str == "&lt;&gt;") {
                            if (a > c || c > b) {
                                $(this).children('td').eq(i).css("color", "red")
                            }
                        }
                    }
                    for (i = 0; i < len; i++) {
                        $(this).children('td').eq(i).click(function () {
                            var objTD = $(this);
                            var oldText = $.trim(objTD.text());
                            var input = $("<input type='text' value=''>" + oldText + "</input>");
                            objTD.html(input);
                            input.click(function () {
                                return false;
                            });
                            //设置文本框样式，让界面显示的人性化点 
                            input.css("font-size", "16px");
                            input.css("text-align", "center");
                            input.css("background-color", "#ffffff");
                            input.width("30px");
                            input.height("14px");
                            //自动选中文本框中的文字 
                            input.select();
                            //文本框失去焦点时重新变为文本 
                            input.blur(function ax() {
                                //获得新输入的类别名 
                                var newText = $(this).val();
                                //用新的类别名文字替换之前变过来的输入框状态 
                                objTD.html(newText);
                                //获取该类别名所对应的ID(bigclassid) 
                                var bigclassid = objTD.prev().text();
                                //将新的类别名进行转码，不然界面以及数据库显示的都是"???"这样的乱码 
                                newText = escape(newText);
                                //alert("n: " + n + " i:" + i + " bigclassid:" + bigclassid);
                                //$("#tabProduct").children("tr").eq(n).children("td").eq(i).css("color", "cyan");
                            });
                            
                            /*当前，我需要在这里进行判断,判断在页面输入的值是否在范围a和b之间；其中要获取输入的值，即等同于newText
                            **/
                            //$(this).css("color", "cyan");//这种方式只能改变，改变数字的颜色，不能判断
                            //我想要达到的效果是这样的：
                            /*
                            var k=newText-0;
                            if (str == "&lt;&gt;") {
                            if (a > k || k > b) {
                                $(this).children('td').eq(i).css("color", "red")
                                }
                            }
                            */
                        });
                    }
                });
            }
        });
    });
</script>
</head>
<body>
    <form id="form1">
    <div>
    <h3>可编辑的表格</h3>
<table width="698" border="0" cellpadding="0" cellspacing="0" id="tabProduct">
    <tr>
      <td width="186" Name="Num" EditType="TextBox">spec1</td>
      <td width="152" Name="ProductName" EditType="DropDownList" DataItems="{text:'A',value:'<>'},{text:'B',value:'<>'},{text:'C',value:'<>'},{text:'D',value:'<>'}">符号</td>
      <td width="103" Name="Num" EditType="TextBox">spec2</td>
      <td width="103" Name="Num" EditType="TextBox">1</td>
      <td width="103" Name="Num" EditType="TextBox">2</td>
      <td width="103" Name="Num" EditType="TextBox">3</td>
      <td width="103" Name="Num" EditType="TextBox">4</td>
      <td width="103" Name="Num" EditType="TextBox">5</td>
    </tr>
    <tr id="test1">
      <td>1</td>
      <td><></td>
      <td>4</td>
      <td>1</td>
      <td>2</td>
      <td></td>
      <td></td>
      <td></td>
    </tr>
    <tr id="test2">
      <td>2</td>
      <td><></td>
      <td>3</td>
      <td>1</td>
      <td>2</td>
      <td>3</td>
      <td>4</td>
      <td>5</td>
    </tr>
</table><br />
    </div>
    </form>
</body>
</html>

解决方案 »

  1.   

    /*当前，我需要在这里进行判断,判断在页面输入的值是否在范围a和b之间；其中要获取输入的值，即等同于newText
       **/
       //$(this).css("color", "cyan");//这种方式只能改变，改变数字的颜色，不能判断
       //我想要达到的效果是这样的：
       /*
       var k=newText-0;
       if (str == "&lt;&gt;") {
       if (a > k || k > b) {
       $(this).children('td').eq(i).css("color", "red")
       }
       }
       */
     
      

  2.   

    判断页面输入的值，应该在 onchange 事件去判断处理。
    ready 函数执行是，用户还没输入
      

  3.   

    其实，我这个用onchange和当前的一样呀，关键是现在我有两种选择：1.得到函数，得不到td标签内的值变色；2.得到td标签内的值变色，得不到函数进行判断，痛苦呀，请各位大大支持一下，谢谢~~
    这里有一个我简化了的：
    http://bbs.php100.com/read-htm-tid-289969.html