我在创建电子邮件地址的文本框时遇到问题,我希望通过示例填写:@ hotmail.com以便只有用户输入实际的标识符,我想在单个文件中执行此操作文本框。 可能吗?我记得我在网站的某个地方看过它。
答案 0 :(得分:4)
这种方法可以满足您的需求
$('button').on('click',function(){
var name = $('#in').val();
var domain = $('#dom').val();
alert(name + domain);
});
#in{
border-right:0px;
margin-right:0px;
padding-right:0px;
}
#dom{
border-left:0px;
margin-left:-5px;
padding-left:0px;
text-align:right;
width:108px
}
input{
border:1px solid black;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<input id="in"/>
<input id="dom" readonly value="@example.com"/>
<button>Subscribe</button>
<p></p>
答案 1 :(得分:0)
使用只有服务器才能看到的隐藏input
可以轻松伪造此效果。
在您的页面中,添加以下HTML:
<input type='text' id='username'> @hotmail.com
<input name='email' type='hidden' />
并在初始化过程中添加以下内容:
$("#username").bind("blur", function() {
$("input[name = 'email']").val($(this).val() + "@hotmail.com");
});
当焦点从可见焦点丢失时,这将填充隐藏的input
,并使用<username>@hotmail.com
填充它。
我创建了一个小提琴here,虽然隐藏的输入已更改为普通文本输入,因此可以看到结果。