如何清除文本框值时，用户单击它里面

本文关键字：用户 单击 何清除 清除 文本 | 更新日期: 2023-09-27 18:09:29

<asp:TextBox ID="Txt_search" runat="server">Group Name..</asp:TextBox>

当用户在文本框内单击输入要搜索的关键字时，我想清除文本框内的文本。我怎么做呢?

如何清除文本框值时，用户单击它里面

使用jquery:

$(function() {
    $('input[type=text]').focus(function() {
           $(this).val('');
      });
 });

from:如何清除文本框的onfocus?

下面的脚本处理onfocus和onblur事件，在集中时删除默认的"Group Name.."，如果用户在不改变任何内容的情况下离开现场，则将其添加回来。

<script type="text/javascript">
  var txtsearch = document.getElementById("Txt_search");
  txtsearch.onfocus = function () {
    if (this.value == "Group Name..") {
      this.value = "";
    }
  };
  txtsearch.onblur = function () {
    if (this.value.length == 0) {
      this.value = "Group Name...";
    }
  }
</script>

我想你可以很容易地使用jQuery，像下面这样。

    $('#<%=Txt_search.ClientID%>').click(function() {
         $(this).val("");
    });

使用jquery清除文本框的焦点，并将其设置为默认的模糊

$(document).ready(function(){
  $('#<%=Txt_search.ClientID%>')
    .focus(function(){  
      if($(this).val()=='Group Name..')
      {
         $(this).val('');
      }
  })
   .blur(function () {
            if ($(this).val() == '') {
                $(this).val('Group Name..');
            }
        });
});

既然你正在使用asp.net webforms，我认为你最好使用AjaxControlToolkit特别是TextBoxWaterMarkExtender控件。

见下面的示例代码。

<asp:TextBox ID="TextBox1" runat="server"></asp:TextBox>
                <asp:TextBoxWatermarkExtender ID="TextBox1_TextBoxWatermarkExtender" 
                    runat="server" Enabled="True" TargetControlID="TextBox1" 
                    WatermarkText="Group Name ...">
                </asp:TextBoxWatermarkExtender>
相关文章：