javascript - Asp.Net 2.0 使用 Javascript 时出现歧义错误

Question

我在下面的 javascript 中遇到了非常奇怪的问题。编译器在文本框代码的第 39 行抛出错误，但它非常正确，不知道为什么会发生这种情况？。

 <script type="text/javascript">
    function WaterMark(txtName, event) {
        var defaultText = "Enter Username Here";
        // Condition to check textbox length and event type
        if (txtName.value.length == 0 & event.type == "Load") {
        //if condition true then setting text color and default text in textbox
        txtName.style.color = "Gray";
        txtName.value = defaultText;
    }
        // Condition to check textbox value and event type
        if (txtName.value == defaultText & event.type == "TextChanged") {
        txtName.style.color = "black";
        txtName.value = "";
    }
    }

  <table id="Search"><tr><td>
  <cc1:ToolkitScriptManager ID="TKit" runat="server"></cc1:ToolkitScriptManager>
  <asp:TextBox ID="Tbox" runat="server" Width="300"  OnLoad="WaterMark(this,event);" OnTextChanged ="WaterMark(this,event);" ></asp:TextBox>
            <cc1:AutoCompleteExtender 
                ID="Atx"  
                TargetControlID="Tbox" 
                runat="server" 
                UseContextKey="True"
                MinimumPrefixLength="1"
                EnableCaching="true" 
                CompletionSetCount="1"
                CompletionInterval="1000"
                ServiceMethod="location"
                CompletionListCssClass ="MM">
             </cc1:AutoCompleteExtender>
        </td></tr><tr><td>

如何克服这个问题，有什么解决办法吗？.!

Error Display

Answer 1

asp:TextBox是服务器端控件。它有几个服务器端events .
当 aspx 标记属性名称与此事件的名称匹配时，asp 尝试查找此事件的函数。
就您而言，我认为您想要添加客户端事件处理程序，但 asp 认为您的意思是服务器端。

第一个:输入文本更改的客户端事件 - 是 onchange

第二个:至于load事件 - 您无法使用type=text为输入添加此事件，所以您可以使用 window.onload在其中检查所需的文本框，或查看此 link

所以最终你的标记将是这样的

<asp:TextBox ID="Tbox" runat="server" Width="300"  onchange ="WaterMark(this,event);" ></asp:TextBox>

和脚本，例如，像

<script type="text/javascript">
    function WaterMark(txtName, event) {
        var defaultText = "Enter Username Here";
        // Condition to check textbox length and event type
        if (txtName.value.length == 0 & event.type == "Load") {
            //if condition true then setting text color and default text in textbox
            txtName.style.color = "Gray";
            txtName.value = defaultText;
        }
        // Condition to check textbox value and event type
        if (txtName.value == defaultText & event.type == "change") {
            txtName.style.color = "black";
            txtName.value = "";
        }
    }

    window.onload = function () {
        var defaultText = "Enter Username Here";
        var txtName = document.getElementById('<%: Tbox.ClientID %>');
        // Condition to check textbox length and event type
        if (txtName.value.length == 0) {
            //if condition true then setting text color and default text in textbox
            txtName.style.color = "Gray";
            txtName.value = defaultText;
        }
    }
</script>

更新我认为，您需要使用 onclick 事件而不是 onchange 来实现您的功能，即

<asp:TextBox ID="Tbox" runat="server" Width="300"  onclick ="WaterMark(this,event);" ></asp:TextBox>

<script type="text/javascript">
    function WaterMark(txtName, event) {
        var defaultText = "Enter Username Here";
        // Condition to check textbox value and event type
        if (txtName.value == defaultText & event.type == "click") {
            txtName.style.color = "black";
            txtName.value = "";
        }
    }

    window.onload = function () {
        var defaultText = "Enter Username Here";
        var txtName = document.getElementById('<%: Tbox.ClientID %>');
        // Condition to check textbox length and event type
        if (txtName.value.length == 0) {
            //if condition true then setting text color and default text in textbox
            txtName.style.color = "Gray";
            txtName.value = defaultText;
        }
    }
</script>