无法通过javascript访问自定义文本框属性

本文关键字：自定义 文本 属性 访问 javascript | 更新日期: 2023-09-27 18:15:52

我创建了一个继承自textbox的自定义文本框。

    using System.Drawing;
    using System;
    using System.Collections.Generic;
    using System.ComponentModel;
    using System.Linq;
    using System.Text;
    using System.Web;
    using System.Web.UI;
    using System.Web.UI.WebControls;
    namespace GNB.DPS.MVAD.CustomWebControls
    {
        [Designer("GNB.DPS.MVAD.CustomWebControls.MVADTextBox, GNB.DPS.MVAD.CustomWebControls"), DefaultProperty("Text"), ToolboxData("<{0}:MVADTextBox runat=server></{0}:MVADTextBox>")]
        public class MVADTextBox : TextBox
        {
            public virtual string SampleText
            {
                get
                {
                    string s = (string)ViewState["SampleText"];
                    return s ?? String.Empty;
                }
                set
                {
                    ViewState["SampleText"] = value;
                }
            }
            [Bindable(false)]
            [Category("Properties")]
            [DefaultValue("")]
            [Localizable(true)]
            public string Mask
            {
                get
                {
                    String tblName = (String)ViewState["Mask"];
                    return (Mask ?? String.Empty);
                }
                set
                {
                    ViewState["Mask"] = value;
                }
            }
            protected override void OnLoad(EventArgs e)
            {
                if(!Page.IsPostBack)
                {
                    if(Text == String.Empty)
                    {
                        if (SampleText != "")
                        {
                            CssClass = "sampleText";
                            this.Text = SampleText;
                            var onFocus = "<script language='"javascript'">function ClearField(input) { if(input.value == input.defaultValue){input.value = '"'"; input.className = 'regularText';} } </script>";
                            var onBlur = "<script language='"javascript'"> function PopulateField(input) {if (input.value == '"'") {input.value = input.defaultValue; input.className = 'sampleText'; } } </script>";
                            Page.ClientScript.RegisterClientScriptBlock(this.GetType(), "OnFocus", onFocus);
                            this.Attributes.Add("onfocus", "ClearField(this);");
                            Page.ClientScript.RegisterClientScriptBlock(this.GetType(), "OnBlur", onBlur);
                            this.Attributes.Add("onblur", "PopulateField(this);");
                        }
                    }
                }
            }
        }
    }

在.aspx上，它可以这样使用…

<script language="javascript">
    function MaskInput(input) {
        var textbox = document.getElementById(input.id);
        var mask = textbox.getAttribute('Mask');
    } 
</script>
    <MVAD:MVADTextBox ID="tbMVAD2" runat="server" SampleText="Hello" Mask="###-###" onKeyPress="MaskInput(this);" />
然而

…var mask = textbox.getAttribute(' mask ');

在视图源中我们看到…

<input name="ctl00$cphListBody$tbMVAD2" type="text" value="Hello" id="ctl00_cphListBody_tbMVAD2" class="sampleText" onKeyPress="MaskInput(this);" onfocus="ClearField(this);" onblur="PopulateField(this);" />

请注意，源代码中没有名为Mask或Sample Text的属性。因此，我不能通过javascript访问属性。我的控制设置正确吗?什么好主意吗?

无法通过javascript访问自定义文本框属性

我认为您在客户端和服务器端之间存在很大的混淆。"Mask"属性仅在。net(服务器端)上，您正试图从javascript(客户端)读取它。"mask"属性不被渲染。你可以修改"OnLoad"方法来添加它，或者像Gabriel的答案建议的那样简单地在事件上传递属性。

protected override void OnLoad(EventArgs e)
{
    if(!Page.IsPostBack)
         {
             if(Text == String.Empty)
             {
                 if (SampleText != "")
                 {
                            CssClass = "sampleText";
                            this.Text = SampleText;
                            var onFocus = "<script language='"javascript'">function ClearField(input) { if(input.value == input.defaultValue){input.value = '"'"; input.className = 'regularText';} } </script>";
                            var onBlur = "<script language='"javascript'"> function PopulateField(input) {if (input.value == '"'") {input.value = input.defaultValue; input.className = 'sampleText'; } } </script>";
                            Page.ClientScript.RegisterClientScriptBlock(this.GetType(), "OnFocus", onFocus);
                            this.Attributes.Add("onfocus", "ClearField(this);");
                            Page.ClientScript.RegisterClientScriptBlock(this.GetType(), "OnBlur", onBlur);
                            this.Attributes.Add("onblur", "PopulateField(this);");
                            this.Attributes.Add("Mask", this.Mask);
                        }
                    }
                }
            }
编辑:

public string Mask
            {
                get
                {
                    String tblName = (String)ViewState["Mask"];
                    return (Mask ?? String.Empty); // This is causing your stack overflow...
                }
            }

像这样把你的蒙版放入函数中:

<script language="javascript">
    function MaskInput(input, mask) {
        var textbox = document.getElementById(input.id);
    } 
</script>
    <MVAD:MVADTextBox ID="tbMVAD2" runat="server" SampleText="Hello" onKeyPress="MaskInput(this, '###-###');" />

您的自定义属性在构造视图时被asp.net应用程序忽略。

相关文章：