为什么我双击单元格,里面的数字和字母的大小会有点膨胀,而中文的话就不会发生变化???如何让数字和字母也跟中文一样,在双击的时候大小不会发生变化!<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default22.aspx.cs" Inherits="Default22" %><!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>
    <script>
    
function rw()
{
var tb=document.getElementById("cc");
for(var i=0; i<tb.rows.length;i++)
{
for(var j=0;j<tb.rows[i].cells.length;j++)
{
tb.rows[i].cells[j].ondblclick=sjsj;
}
}
}
function sjsj()
{
var bh=document.getElementById("bh");
var tdid=null;
var txtid=null;
var curtd=window.event.srcElement;
if (bh!=null)
{
return;
}
tdid=window.event.srcElement;
tdtxt=tdid.innerText;
tdtxt=Trim(tdtxt).toString();
var s="<div  id='bh' class='soCore'>";
    s=s+"<div class='soText'>";
    s=s+"<input id='srtext' class='txtSearch' onblur='ChangeTdText();'type='text' maxlength='20' value='"+tdtxt+"'";
    s=s+" name='q' autocomplete='off' />";
    s=s+"<input type='hidden' id='tdinitValue' value='"+tdtxt+"'>";
    s=s+"</div>";
    s=s+"<div class='soButton'>";
    s=s+"<div class='btnSearch'>";
    s=s+"<a onclick='cz();' href='#'>...</a>";
    s=s+"</div></div></div>";
   tdid.innerHTML=s;
   document.getElementById("srtext").focus;
   var ctr=document.getElementById("srtext").createTextRange();
   ctr.collapse(false);
   ctr.select();
}function Trim(str)
{
return str.replace(/(^\s*)|(\s*$)/g,"");
}function cz()
{
alert("hello!");
var txtid=document.getElementById("srtext");
if(txtid==null)
{
return;
}
var tdid=document.getElementById("bh").parentElement;
tdid.innerText=Trim(txtid.value);
}function ChangeTdText()
{
if(document.activeElement.tagName=="A") return;
var txtid=document.getElementById("srtext");
if(txtid==null)
{
return;
}
var tdid=document.getElementById("bh").parentElement;
tdid.innerText=Trim(txtid.value);}function CancelTdChanged()
{
var tdinitValue=document.getElementById("tdinitValue");
var tdtxt=tdinitValue.value;
var tdid=document.getElementById("bh").parentElement;
tdid.innerText=Trim(tdtxt).toString();
}
document.onkeypress=function()
{
if (event.keyCode==27)
{
CancelTdChanged();
return;
}
} </script>
<style>.ty
{
border:1px solid #00ccff;
border-collapse:collapse;
cellpadding:0px;
cellspacing:0px;
}
.ty td
{
border:1px solid #00ccff;;
padding:0px;
margin:0px;
line-height:16px;
font-size:14px;
}    .soButton .btnSearch
    {
    height:22px;
    background-color:#ccccdd;
    }
    .soButton .btnSearch a
    {
    display:block;
    height:20px;
    text-align:center;
    font-size:20px;
    color:#000;
    text-decoration:none;
    font-weight;bold;
    line-height:20px;
    }
    .clear
    {
    clear:both;
    height:0px;
    overflow:hidden;
    
    }
    .soButton
    {
    float:left;
    width:24px;
    height:22px;
    background-color:#fff;
    border:0px;
    border-left:1px solid black;
    overflow:hidden;
    }
    .soText .txtSearch
    {
    display:block;
    width:120px;
    height:16px;
    line-height:16px;
    font-size:14px;
    padding:3px 0px;
    background-color:#fff;
    border:none;
    }
    .soText
    {
    float:left;
    width:120px;
    height:22px;
    background-color:#fff;
    border:0px;
    overflow:hidden;
    }
    .soCore
    {
    margin:0px;
    padding:0px;
    }
    </style>
</head>
<body onload="rw();">
    <form id="form1" runat="server">       
        <table id="cc" class="ty" language="javascript">
            <tr>
                <td style="height: 22px; width:145px;">
           东西
                </td>
                <td style="height: 22px; width: 145px;">你好吗?
                </td>
                <td style="height: 22px;width:145px;">aaaaaa
                </td>
            </tr>
            <tr>
               
                <td style="height: 22px; width:145px;">
                肯定
                </td>
                <td style="height: 22px; width: 145px;">123456
                </td>
                <td style="height: 22px;width:145px;" >123456
                </td>
            </tr>
            <tr>
                
                <td style="height: 22px; width:145px;">
              达到
                </td>
                <td style="height: 22px; width: 145px;">bbbbb
                </td>
                <td style="height: 22px;width:145px;" >123456
                </td>
            </tr>
        </table>
    
    </form>
</body>
</html>

解决方案 »

  1.   

    我把这个文件保存为HTML文件,就不会出现这种情况,ASPX和HTML在处理这种情况有什么差别???
      

  2.   

    改为HTML文件,再双击纹丝不动!!!达到完美效果!大家可以学习一下,网上还没有这样的列子可学啊,是我研究优酷网学来的技巧,但为什么ASPX就不行呢!
    <html>
    <head>
        <title>无标题页</title>
        <script>
        
    function rw()
    {
    var tb=document.getElementById("cc");
    for(var i=0; i<tb.rows.length;i++)
    {
    for(var j=0;j<tb.rows[i].cells.length;j++)
    {
    tb.rows[i].cells[j].ondblclick=sjsj;
    }
    }
    }
    function sjsj()
    {
    var bh=document.getElementById("bh");
    var tdid=null;
    var txtid=null;
    var curtd=window.event.srcElement;
    if (bh!=null)
    {
    return;
    }
    tdid=window.event.srcElement;
    tdtxt=tdid.innerText;
    tdtxt=Trim(tdtxt).toString();
    var s="<div  id='bh' class='soCore'>";
        s=s+"<div class='soText'>";
        s=s+"<input id='srtext' class='txtSearch' onblur='ChangeTdText();'type='text' maxlength='20' value='"+tdtxt+"'";
        s=s+" name='q' autocomplete='off' />";
        s=s+"<input type='hidden' id='tdinitValue' value='"+tdtxt+"'>";
        s=s+"</div>";
        s=s+"<div class='soButton'>";
        s=s+"<div class='btnSearch'>";
        s=s+"<a onclick='cz();' href='#'>...</a>";
        s=s+"</div></div></div>";
       tdid.innerHTML=s;
       document.getElementById("srtext").focus;
       var ctr=document.getElementById("srtext").createTextRange();
       ctr.collapse(false);
       ctr.select();
    }function Trim(str)
    {
    return str.replace(/(^\s*)|(\s*$)/g,"");
    }function cz()
    {
    alert("hello!");
    var txtid=document.getElementById("srtext");
    if(txtid==null)
    {
    return;
    }
    var tdid=document.getElementById("bh").parentElement;
    tdid.innerText=Trim(txtid.value);
    }function ChangeTdText()
    {
    if(document.activeElement.tagName=="A") return;
    var txtid=document.getElementById("srtext");
    if(txtid==null)
    {
    return;
    }
    var tdid=document.getElementById("bh").parentElement;
    tdid.innerText=Trim(txtid.value);}function CancelTdChanged()
    {
    var tdinitValue=document.getElementById("tdinitValue");
    var tdtxt=tdinitValue.value;
    var tdid=document.getElementById("bh").parentElement;
    tdid.innerText=Trim(tdtxt).toString();
    }
    document.onkeypress=function()
    {
    if (event.keyCode==27)
    {
    CancelTdChanged();
    return;
    }
    } </script>
    <style>.ty
    {
    border:1px solid #00ccff;
    border-collapse:collapse;
    cellpadding:0px;
    cellspacing:0px;
    }
    .ty td
    {
    border:1px solid #00ccff;;
    padding:0px;
    margin:0px;
    line-height:22px;
    font-size:14px;
    }    .soButton .btnSearch
        {
        height:22px;
        background-color:#ccccdd;
        }
        .soButton .btnSearch a
        {
        display:block;
        height:20px;
        text-align:center;
        font-size:20px;
        color:#000;
        text-decoration:none;
        font-weight;bold;
        line-height:20px;
        }
        .clear
        {
        clear:both;
        height:0px;
        overflow:hidden;
        
        }
        .soButton
        {
        float:left;
        width:24px;
        height:22px;
        background-color:#fff;
        border:0px;
        border-left:1px solid black;
        overflow:hidden;
        }
        .soText .txtSearch
        {
        display:block;
        width:120px;
        height:22px;
        line-height:22px;
        font-size:14px;
        padding:0px;
        background-color:#fff;
        border:none;
        }
        .soText
        {
        float:left;
        width:120px;
        height:22px;
        background-color:#fff;
        border:0px;
        overflow:hidden;
        }
        .soCore
        {
        margin:0px;
        padding:0px;
        }
        </style>
    </head>
    <body onload="rw();">     
            <table id="cc" class="ty" language="javascript">
                <tr>
                    <td style="height: 23px; width:144px;">
               东西
                    </td>
                    <td style="height: 23px; width: 144px;">你好吗?
                    </td>
                    <td style="height: 23px;width:144px;">aaaaaa
                    </td>
                </tr>
                <tr>
                   
                    <td style="height: 23px; width:144px;">
                    肯定
                    </td>
                    <td style="height: 23px; width: 144px;">123456
                    </td>
                    <td style="height: 23px; width:144px;" >123456
                    </td>
                </tr>
                <tr>
                    
                    <td style="height: 23px; width:144px;">
                  达到
                    </td>
                    <td style="height: 23px; width: 144px;">bbbbb
                    </td>
                    <td style="height: 23px; width:144px;" >123456
                    </td>
               </tr>
            </table>
    </body>
    </html>
      

  3.   

    上面的列子在做ERP软件时非常有用处,比如可以做库存出入库单据,双击既可编辑输入,单击按钮可以参照录入,上面提供了一个模版,在文本框失去事件中可以用AJAX验证数据是否正确!