[英]Display description in Username and Password field
I'm trying to create a similar login as in https://login.microsoftonline.com/ . 我正在尝试创建与https://login.microsoftonline.com/中类似的登录名。 I want to display a description "someone@example.com" and "Password" in the fields.
我想在字段中显示说明“ someone@example.com”和“密码”。
I've tried to use the txReplaceFormPassword.js ( http://snipplr.com/view/29555/ ) script to dynamically replace the fields but it is returning html text instead of the actual field. 我尝试使用txReplaceFormPassword.js( http://snipplr.com/view/29555/ )脚本动态替换字段,但它返回的是html文本而不是实际字段。
<head>
<script src="@Url.Content("~/Scripts/txReplaceFormPassword.js")" type="text/javascript"></script>
<script type="text/javascript">
$(document).ready(function () {
$('.pwdfield').txReplaceFormPassword({
show_text: 'Password'
});
});
</script>
</head>
<div class="pwdfield">
@Html.PasswordFor(model => model.Password, new {@class = "k-textbox", style = "width:300px"})
@Html.ValidationMessageFor(model => model.Password)
</div>
I'm getting the following output in the browser: 我在浏览器中得到以下输出:
Please let me know how can I get a description inside Password/Username field similar to the two links above. 请让我知道如何在“密码/用户名”字段中获得与上述两个链接相似的描述。
Thanks. 谢谢。
I think this is what you want: 我认为这是您想要的:
<input type="text" placeholder="someone@example.com" /><br />
<input type="password" placeholder="Password" />
As far as I know, you don't need to use js or jQuery for that. 据我所知,您不需要为此使用js或jQuery。 Just set the
placeholder=""
to the text you want to show in the fields. 只需将
placeholder=""
设置为要在字段中显示的文本。
Take a look on this link . 看一下这个链接 。
EDIT 编辑
Then use the following jQuery (tested on ie 7): 然后使用以下jQuery(在ie 7上测试):
(function($){
var placeholderIsSupported = ('placeholder' in document.createElement('input'));
$.fn.emulatePlaceholder = function(){
if(!placeholderIsSupported){
this.each(function(index, element){
var handle = $(element);
var placeholder = handle.attr('placeholder');
if(handle.val() == ''){
handle.val(placeholder);
}
handle.blur(function(e){
var handle = $(this);
if(handle.val() == ''){
handle.val(placeholder);
}
});
handle.focus(function(e){
var handle = $(this);
if(handle.val() == placeholder){
handle.val('');
}
});
});
}
};
})(jQuery);
USAGE: 用法:
$('input').emulatePlaceholder();
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.