ItemTemplate中的文本框的onkeypress事件未在chrome和firefox上触发

时间:2013-02-22 10:32:49

标签: javascript asp.net

我试图用文本框的onKeypress事件验证2位小数的十进制数。 它与IE一起工作正常。但不是使用chrome和firefox。但我的页面设计和javascipt功能如下。 有人可以帮我解决这个问题。

<asp:UpdatePanel ID="UpdatePanel3" UpdateMode="Conditional" runat="server">
                <ContentTemplate>
                    <div class="grid-container-style">
                        <ig:WebDataGrid ID="grdname" runat="server" Width="100%" AutoGenerateColumns="False"
                            TabIndex="5" ViewStateMode="Enabled"
                            ClientIDMode="Static" DataKeyFields="Id" EnableDataViewState="True"
                            DefaultColumnWidth="100%">
                            <AjaxIndicator Enabled="False" />
                            <Columns>
                                <ig:TemplateDataField Key="field" Width="8%">
                                    <ItemTemplate>
                                        <asp:TextBox ID="txtJanuary" Width="100%" runat="server" TabIndex="5" ondblclick="this.focus();this.select()"
                                            MaxLength="12" onchange="ValueChange(event,this,'field')" onkeypress="javascript:return InputDecimalCheck(event,this);"
                                            SkinID="numeric-textbox" Text='<%# DataBinder.Eval(((Infragistics.Web.UI.TemplateContainer)Container).DataItem, "field") %>'></asp:TextBox>
                                    </ItemTemplate>
                                    <Header Text="field" />
                                    <Footer />
                                </ig:TemplateDataField>
                            </Columns>
                            <Behaviors>
                                <ig:Selection RowSelectType="None" CellClickAction="Cell" CellSelectType="None">
                                </ig:Selection>
                                <ig:Activation Enabled="true">
                                </ig:Activation>
                                <ig:RowSelectors Enabled="false" RowNumbering="true" />
                                <ig:ColumnMoving Enabled="false" />
                            </Behaviors>
                        </ig:WebDataGrid>
                    </div>
                </ContentTemplate>
            </asp:UpdatePanel>

下面给出的Javascript代码

function InputDecimalCheck(e, txtControl) {
    if ((e.shiftKey && e.keyCode == 45) || e.which != 8 && e.which != 0 && (e.which < 48 || e.which > 57) && e.which != 46) {
        return false;
    }
    // . = 46
    var text = txtControl.value;

    // Only one decimal point
    if (e.which == 46 && text.indexOf('.') != -1) {
        return false;
    }
    var decimalIndex = text.length - text.indexOf('.');
    // Only 2 numbers after decimal
    if (text.indexOf('.') != -1 && (text.length - text.indexOf('.')) > 2 && !(txtControl.selectionStart <= text.indexOf('.'))) {
        return false;
    }
    return true;
}

chrome和firefox没有检测到它的函数调用。

2 个答案:

答案 0 :(得分:1)

我修改了您的代码以满足您的要求。我希望你能理解逻辑。

您复制粘贴以下代码并尝试从您这边。

在您的代码中写下以下代码:

protected void Page_Load(object sender, EventArgs e)
{
    TextBox1.Attributes.Add("OnKeyPress", "return InputDecimalCheck(event,'"+ TextBox1.ClientID +"');");
}

Javascript代码:

function InputDecimalCheck(key, txtControl) {
    var unicode = (key.which) ? key.which : key.keyCode;

    if ((unicode == 45) || unicode != 8 && unicode != 0 && (unicode < 48 || unicode > 57) && unicode != 46) {
        return false;
    }
    // . = 46
    var text = document.getElementById(txtControl).value;

    // Only one decimal point
    if (unicode == 46 && text.indexOf('.') != -1) {
        return false;
    }
    var decimalIndex = text.length - text.indexOf('.');
    // Only 2 numbers after decimal
    if (text.indexOf('.') != -1 && (text.length - text.indexOf('.')) > 2 && !(txtControl.selectionStart <= text.indexOf('.'))) {
        return false;
    }
    return true;
}

答案 1 :(得分:0)

查看此帖子click here

在这里,您可以在不同的浏览器中找到事件的兼容性。