Merge branch 'szzh' of http://repository.trustie.net/xianbo/trustie2 into szzh
commit
dac4ffe66e
@ -1,68 +1,90 @@
|
|||||||
<script>
|
<script type="text/javascript" src="/javascripts/jquery.min.js"></script>
|
||||||
function verifyAddress() {
|
<script type="text/javascript" src="/javascripts/jQuery.autoMail.js"></script>
|
||||||
var email = $.trim($('#mail').val());
|
<script type="text/javascript">
|
||||||
var filter = /^([a-zA-Z0-9_\.\-])+\@(([a-zA-Z0-9\-])+\.)+([a-zA-Z0-9]{2,4})+$/;
|
$(document).ready(function(){
|
||||||
if(email == "")
|
$("#mail").mailAutoComplete({
|
||||||
{
|
boxClass: "out_box", //外部box样式
|
||||||
$("#valid_email").html("邮箱地址不能为空！");
|
listClass: "list_box", //默认的列表样式
|
||||||
}
|
focusClass: "focus_box", //列表选样式中
|
||||||
else if (filter.test(email)) {
|
markCalss: "mark_box", //高亮样式
|
||||||
$("#valid_email").html("");
|
autoClass: false,
|
||||||
return true;
|
textHint: true //提示文字自动隐藏
|
||||||
}
|
});
|
||||||
else
|
});
|
||||||
{
|
</script>
|
||||||
$("#valid_email").html("您输入的邮箱格式不正确！");
|
<style type="text/css">
|
||||||
}
|
.out_box{border:1px solid #ccc; background:#fff; font:12px/20px Tahoma;}
|
||||||
return false;
|
.list_box{border-bottom:1px solid #eee; padding:0 5px; cursor:pointer;}
|
||||||
}
|
.focus_box{background:#83DAF6;}
|
||||||
|
.mark_box{color:#FF7143;}
|
||||||
function senderEmail(obj)
|
</style>
|
||||||
{
|
<script>
|
||||||
if(verifyAddress())
|
function verifyAddress() {
|
||||||
{
|
var email = $.trim($('#mail').val());
|
||||||
obj.parent().submit();
|
var filter = /^([a-zA-Z0-9_\.\-])+\@(([a-zA-Z0-9\-])+\.)+([a-zA-Z0-9]{2,4})+$/;
|
||||||
}
|
if(email == "")
|
||||||
}
|
{
|
||||||
|
$("#valid_email").html("邮箱地址不能为空！");
|
||||||
|
}
|
||||||
// if (filter.test(email)&& !(email.value == null)) return true;
|
else if (filter.test(email)) {
|
||||||
// else
|
$("#valid_email").html("");
|
||||||
// {
|
return true;
|
||||||
// document.getElementById('valid_email').innerHTML = "您所填写的电子邮件格式不正确";
|
}
|
||||||
// document.getElementById('valid_email').style.color = "#FF0000";
|
else
|
||||||
// return false;
|
{
|
||||||
// }
|
$("#valid_email").html("您输入的邮箱格式不正确！");
|
||||||
//
|
}
|
||||||
// }
|
return false;
|
||||||
</script>
|
}
|
||||||
<div class="project_r_h">
|
|
||||||
<h2 class="project_h2"><%= l(:label_invite_join)%></h2>
|
function senderEmail(obj)
|
||||||
</div>
|
{
|
||||||
<div class="floatbox" style="margin:130px;">
|
if(verifyAddress())
|
||||||
<div >
|
{
|
||||||
<a href="#" class="box_close"></a>
|
obj.parent().submit();
|
||||||
</div>
|
}
|
||||||
<div class="cl"></div>
|
}
|
||||||
<div class="box_main">
|
|
||||||
<div style="padding-left: 20px;">
|
|
||||||
<h3 class="box_h3"><%= l(:label_invite_new_user)%></h3>
|
// if (filter.test(email)&& !(email.value == null)) return true;
|
||||||
<p class="box_p">
|
// else
|
||||||
<%= l(:label_invite_email_tips)%>
|
// {
|
||||||
</p>
|
// document.getElementById('valid_email').innerHTML = "您所填写的电子邮件格式不正确";
|
||||||
<div id="is_registed">
|
// document.getElementById('valid_email').style.color = "#FF0000";
|
||||||
<%= render :partial => 'regested', locals: { :isregisted => false} %>
|
// return false;
|
||||||
</div>
|
// }
|
||||||
<%= form_tag('send_mail_to_member', :controller => 'projects',:action => 'send_mail_to_member', method: 'get') do %>
|
//
|
||||||
<span id="valid_email" style="color: #FF0000;"></span>
|
// }
|
||||||
<%= text_field_tag 'mail', '', :class => "fb_item fl", :placeholder => l(:label_input_email), :onblur => "verifyAddress();" %>
|
</script>
|
||||||
<div class="cl"></div>
|
<div class="project_r_h">
|
||||||
<div class="cl"></div>
|
<h2 class="project_h2"><%= l(:label_invite_join)%></h2>
|
||||||
<a href="#" class="btn_free" onclick="senderEmail($(this));">
|
</div>
|
||||||
<%= l(:label_send_email)%>
|
<div class="floatbox" style="margin:130px;">
|
||||||
</a>
|
<div >
|
||||||
<%#= submit_tag '免费发送', :style => "display:block; width:80px; text-align:center; color:#fff; height:26px; padding-top:3px; margin-bottom:10px;" %>
|
<a href="#" class="box_close"></a>
|
||||||
<% end %>
|
</div>
|
||||||
</div>
|
<div class="cl"></div>
|
||||||
</div>
|
<div class="box_main">
|
||||||
|
<div style="padding-left: 20px;">
|
||||||
|
<h3 class="box_h3"><%= l(:label_invite_new_user)%></h3>
|
||||||
|
<p class="box_p">
|
||||||
|
<%= l(:label_invite_email_tips)%>
|
||||||
|
</p>
|
||||||
|
<div id="is_registed">
|
||||||
|
<%= render :partial => 'regested', locals: { :isregisted => false} %>
|
||||||
|
</div>
|
||||||
|
<%= form_tag('send_mail_to_member', :controller => 'projects',:action => 'send_mail_to_member', method: 'get') do %>
|
||||||
|
<span id="valid_email" style="color: #FF0000;"></span>
|
||||||
|
<div class="lin1_2">
|
||||||
|
<%= text_field_tag 'mail', '', :class => "fb_item fl", :placeholder => l(:label_input_email), :onkeyup => "this.value=this.value.replace(' ','')", :style => "ime-mode:disabled;", :onblur => "verifyAddress(this);" %>
|
||||||
|
</div>
|
||||||
|
<div class="cl"></div>
|
||||||
|
<div class="cl"></div>
|
||||||
|
<a href="#" class="btn_free" onclick="senderEmail($(this));">
|
||||||
|
<%= l(:label_send_email)%>
|
||||||
|
</a>
|
||||||
|
<%#= submit_tag '免费发送', :style => "display:block; width:80px; text-align:center; color:#fff; height:26px; padding-top:3px; margin-bottom:10px;" %>
|
||||||
|
<% end %>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
@ -0,0 +1,153 @@
|
|||||||
|
/**
|
||||||
|
* 2015-01-11
|
||||||
|
* edit by meng
|
||||||
|
*/
|
||||||
|
(function($){
|
||||||
|
$.fn.mailAutoComplete = function(options){
|
||||||
|
var defaults = {
|
||||||
|
boxClass: "mailListBox", //外部box样式
|
||||||
|
listClass: "mailListDefault", //默认的列表样式
|
||||||
|
focusClass: "mailListFocus", //列表选中样式
|
||||||
|
markCalss: "mailListHlignt", //高亮样式
|
||||||
|
zIndex: 1,
|
||||||
|
autoClass: true,//是否使用插件自带class样式
|
||||||
|
mailArr: ["qq.com","gmail.com","126.com","163.com","hotmail.com","live.com","sohu.com","sina.com","sina.cn","139.cn","189.cn"], //邮件数组
|
||||||
|
textHint: false, //文字提示的自动显示与隐藏
|
||||||
|
hintText: "",
|
||||||
|
focusColor: "#333"
|
||||||
|
//blurColor: "#999
|
||||||
|
};
|
||||||
|
var settings = $.extend({}, defaults, options || {});
|
||||||
|
//页面装载CSS样式
|
||||||
|
if(settings.autoClass && $("#mailListAppendCss").size() === 0){
|
||||||
|
$('<style id="mailListAppendCss" type="text/css">.mailListBox{border:1px solid #369; background:#fff; font:12px/20px Arial;}.mailListDefault{padding:0 5px;cursor:pointer;white-space:nowrap;}.mailListFocus{padding:0 5px;cursor:pointer;white-space:nowrap;background:#369;color:white;}.mailListHlignt{color:red;}.mailListFocus .mailListHlignt{color:#fff;}</style>').appendTo($("head"));
|
||||||
|
}
|
||||||
|
var cb = settings.boxClass, cl = settings.listClass, cf = settings.focusClass, cm = settings.markCalss; //插件的class变量
|
||||||
|
var z = settings.zIndex, newArr = mailArr = settings.mailArr, hint = settings.textHint, text = settings.hintText, fc = settings.focusColor, bc = settings.blurColor;
|
||||||
|
//创建邮件内部列表内容
|
||||||
|
$.createHtml = function(str, arr, cur){
|
||||||
|
var mailHtml = "";
|
||||||
|
if($.isArray(arr)){
|
||||||
|
$.each(arr, function(i, n){
|
||||||
|
if(i === cur){
|
||||||
|
mailHtml += '<div class="mailHover '+cf+'" id="mailList_'+i+'"><span class="'+cm+'">'+str+'</span>@'+arr[i]+'</div>';
|
||||||
|
}else{
|
||||||
|
mailHtml += '<div class="mailHover '+cl+'" id="mailList_'+i+'"><span class="'+cm+'">'+str+'</span>@'+arr[i]+'</div>';
|
||||||
|
}
|
||||||
|
});
|
||||||
|
}
|
||||||
|
return mailHtml;
|
||||||
|
};
|
||||||
|
//一些全局变量
|
||||||
|
var index = -1, s;
|
||||||
|
$(this).each(function(){
|
||||||
|
var that = $(this), i = $(".justForJs").size();
|
||||||
|
if(i > 0){ //只绑定一个文本框
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
var w = that.outerWidth(), h = that.outerHeight(); //获取当前对象（即文本框）的宽高
|
||||||
|
//样式的初始化
|
||||||
|
that.wrap('<span style="display:inline-block;position:relative;"></span>')
|
||||||
|
.before('<div id="mailListBox_'+i+'" class="justForJs '+cb+'" style="min-width:'+w+'px;_width:'+w+'px;position:absolute;left:-6000px;top:'+h+'px;z-index:'+z+';"></div>');
|
||||||
|
var x = $("#mailListBox_" + i), liveValue; //列表框对象
|
||||||
|
that.focus(function(){
|
||||||
|
//父标签的层级
|
||||||
|
$(this).css("color", fc).parent().css("z-index", z);
|
||||||
|
//提示文字的显示与隐藏
|
||||||
|
if(hint && text){
|
||||||
|
var focus_v = $.trim($(this).val());
|
||||||
|
if(focus_v === text){
|
||||||
|
$(this).val("");
|
||||||
|
}
|
||||||
|
}
|
||||||
|
//键盘事件
|
||||||
|
$(this).keyup(function(e){
|
||||||
|
s = v = $.trim($(this).val());
|
||||||
|
if(/@/.test(v)){
|
||||||
|
s = v.replace(/@.*/, "");
|
||||||
|
}
|
||||||
|
if(v.length > 0){
|
||||||
|
//如果按键是上下键
|
||||||
|
if(e.keyCode === 38){
|
||||||
|
//向上
|
||||||
|
if(index <= 0){
|
||||||
|
index = newArr.length;
|
||||||
|
}
|
||||||
|
index--;
|
||||||
|
}else if(e.keyCode === 40){
|
||||||
|
//向下
|
||||||
|
if(index >= newArr.length - 1){
|
||||||
|
index = -1;
|
||||||
|
}
|
||||||
|
index++;
|
||||||
|
}else if(e.keyCode === 13){
|
||||||
|
//回车
|
||||||
|
if(index > -1 && index < newArr.length){
|
||||||
|
//如果当前有激活列表
|
||||||
|
$(this).val($("#mailList_"+index).text());
|
||||||
|
}
|
||||||
|
}else{
|
||||||
|
if(/@/.test(v)){
|
||||||
|
index = -1;
|
||||||
|
//获得@后面的值
|
||||||
|
//s = v.replace(/@.*/, "");
|
||||||
|
//创建新匹配数组
|
||||||
|
var site = v.replace(/.*@/, "");
|
||||||
|
newArr = $.map(mailArr, function(n){
|
||||||
|
var reg = new RegExp(site);
|
||||||
|
if(reg.test(n)){
|
||||||
|
return n;
|
||||||
|
}
|
||||||
|
});
|
||||||
|
}else{
|
||||||
|
newArr = mailArr;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
x.html($.createHtml(s, newArr, index)).css("left", 0);
|
||||||
|
if(e.keyCode === 13){
|
||||||
|
//回车
|
||||||
|
if(index > -1 && index < newArr.length){
|
||||||
|
//如果当前有激活列表
|
||||||
|
x.css("left", "-6000px");
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}else{
|
||||||
|
x.css("left", "-6000px");
|
||||||
|
}
|
||||||
|
}).blur(function(){
|
||||||
|
if(hint && text){
|
||||||
|
var blur_v = $.trim($(this).val());
|
||||||
|
if(blur_v === ""){
|
||||||
|
$(this).val(text);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
$(this).css("color", bc).unbind("keyup").parent().css("z-index",0);
|
||||||
|
x.css("left", "-6000px");
|
||||||
|
|
||||||
|
}).keydown(function(event){
|
||||||
|
if(event.keyCode == 13){
|
||||||
|
return false;
|
||||||
|
}
|
||||||
|
});
|
||||||
|
//鼠标经过列表项事件
|
||||||
|
//鼠标经过
|
||||||
|
$(".mailHover").live("mouseover", function(){
|
||||||
|
index = Number($(this).attr("id").split("_")[1]);
|
||||||
|
liveValue = $("#mailList_"+index).text();
|
||||||
|
x.children("." + cf).removeClass(cf).addClass(cl);
|
||||||
|
$(this).addClass(cf).removeClass(cl);
|
||||||
|
});
|
||||||
|
$(".mailHover").live("click", function(){
|
||||||
|
$("#mail").val($(this).html());
|
||||||
|
});
|
||||||
|
|
||||||
|
|
||||||
|
});
|
||||||
|
|
||||||
|
x.bind("mousedown", function(){
|
||||||
|
that.val(liveValue);
|
||||||
|
});
|
||||||
|
});
|
||||||
|
};
|
||||||
|
|
||||||
|
})(jQuery);
|
||||||
Loading…
Reference in new issue