Question

我得到了article这样做但是我发现这不起作用，因为我在同一个文本框中给了多个类。如何将其转换为使用多个类。我不知道如何使用选择器来工作。

我正在使用它

<div class="inbox3full">
    <div class="threeinbg"><asp:TextBox ID="txtSortOrder" CssClass="threein water" 
            Text='<%# Bind("SortOrder") %>' runat="server" ToolTip="Type your Sort Order"></asp:TextBox></div>
</div>

以jquery为

<script type="text/javascript">
//    $(document).ready(function() { 
        $(function() {

            $(".water").each(function() {
                $tb = $(this);
                if ($tb.val() != this.title) {
                    $tb.removeClass("water");
                }
            });

            $(".water").focus(function() {
                $tb = $(this);
                if ($tb.val() == this.title) {
                    $tb.val("");
                    $tb.removeClass("water");
                }
            });

            $(".water").blur(function() {
                $tb = $(this);
                if ($.trim($tb.val()) == "") {
                    $tb.val(this.title);
                    $tb.addClass("water");
                }
            });
        });
   // });
    </script>

修改系统未定义。

.water{font-family: Tahoma, Arial, sans-serif;font-size:75%; color:black;}

<script type="text/javascript">
    $(document).ready(function() {
        $(".water").addClass('watermark');
        $(".watermark").live('focus', function() {
            $tb = $(this);
            if ($tb.val() == this.title) {
                $tb.val("");
                $tb.removeClass("water");
            }
        }).live('blur', function() {
            $tb = $(this);
            if ($.trim($tb.val()) == "") {
                $tb.val(this.title);
                $tb.addClass("water");
            }
        }).blur();
    });

    Sys.WebForms.PageRequestManager.getInstance().add_endRequest(function() {
      $(".water").not(document.activeElement).blur();
    });
    </script>

Answer 1

而不是像你一样.each()，更容易点击blur处理程序，就像这样（编辑为使用.live()，因为你在UpdatePanel中添加它们）：

$(function() {
  $(".water").addClass("watermark");
  $(".watermark").live('focus', function() {
    $tb = $(this);
    if ($tb.val() == this.title) {
        $tb.val("");
        $tb.removeClass("water");
    }
  }).live('blur', function() {
    $tb = $(this);
    if ($.trim($tb.val()) == "") {
        $tb.val(this.title);
        $tb.addClass("water");
    }
  }).blur();
});

You can see it working here。如果框最初为空，这会将水印/标题放入，这通常是您想要的。此外，当您的PanelPanel完成后，您将再次对这些元素调用.blur()以将水印应用于新创建的元素，如下所示：

Sys.WebForms.PageRequestManager.getInstance().add_endRequest(function() {
  $(".water").not(document.activeElement).blur();
});

这将模糊除当前焦点之外的所有元素，以免中断用户输入。

如何在asp.net中使用jquery创建水印效果

1 个答案: