文章/答案/技术大牛

发布

社区首页 >问答首页 >如何自定义@Html.TextBoxFor的水印文本(..)在MVC4中

问如何自定义@Html.TextBoxFor的水印文本(..)在MVC4中
EN

Stack Overflow用户

提问于 2013-05-08 20:10:09

回答 3查看 5.1K关注 0票数 0

我的@Html.TextBoxFor()中有一个水印文本。我想通过将水印文本更改为淡入淡出的颜色并在单击文本框时隐藏水印文本来自定义它。

这是我的代码-

@Html.TextBoxFor(model => model.Code, new { maxlength = 5, @placeholder="watermark" })

watermark

css

html

asp.net-mvc-4

razor

回答 3

Stack Overflow用户

回答已采纳

发布于 2013-05-08 20:16:36

由于并不是所有的浏览器都支持书签，所以你应该使用一些javascript来给用户相同的水印感觉，即使他们没有使用支持它的浏览器。如果你使用的是jQuery，那就试试这个https://code.google.com/p/jquery-watermark/

票数 1

Stack Overflow用户

发布于 2013-05-08 20:21:04

为此，您必须考虑使用JQuery占位符插件，使用此插件，您只需定义一个与示例完全相同的占位符属性即可。

该插件和几个示例可以在here中找到。

票数 0

Stack Overflow用户

发布于 2013-05-08 20:56:37

虽然新的浏览器支持占位符文本，但它们在焦点上的行为是不同的。我个人认为这是完全可以接受的，毕竟他们是不同的浏览器。

我们当然可以通过使用这些CSS属性来设置占位符文本的样式

CSS

::-webkit-input-placeholder {
   color: red;
}

:-moz-placeholder { /* Firefox 18- */
   color: red;  
}

::-moz-placeholder {  /* Firefox 19+ */
   color: red;  
}

:-ms-input-placeholder {  
   color: red;  
}

如果你想要一个基于JavaScript的解决方案，而不是使用一个插件，这可以很容易地自己完成，即使不需要jQuery。

JS示例

<input type="text" value="Watermark" onfocus="if (this.value == 'Watermark') {this.value = '';}" onblur="if (this.value == '') {this.value = 'Watermark';}">

票数 0

页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持

原文链接：

https://stackoverflow.com/questions/16440336

复制

相似问题

问如何自定义@Html.TextBoxFor的水印文本(..)在MVC4中
EN

回答 3

Stack Overflow用户

Stack Overflow用户

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问如何自定义@Html.TextBoxFor的水印文本(..)在MVC4中EN

回答 3

Stack Overflow用户

Stack Overflow用户

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问如何自定义@Html.TextBoxFor的水印文本(..)在MVC4中
EN