socialforge/app/views/account/login.html.erb

<%= stylesheet_link_tag 'new_user'%>
<%= stylesheet_link_tag 'leftside'%>

<script type="text/javascript">

//    $(document).ready(function(){
//        $("#loginSignButton").click(function(){
//            $("#signUpBox").css({display:"block"});
//            $("#loginInBox").css({display:"none"});
//        });
//        $("#loginInButton").click(function(){
//            $("#signUpBox").css({display:"none"});
//            $("#loginInBox").css({display:"block"});
//        });
//    });
//    $(function(){
//        $("#username").keypress(function(e){
//            alert(11);
//            if (e.keyCode == '13') {
//                $('#main_login_form').submit();
//            }
//        });
//
//        $("#password").keypress(function(e){
//            if (e.keyCode == '13') {
//                $('#main_login_form').submit();
//            }
//        });
//    });

    $(document).ready(function(){
        $(".homepageSearchIcon").click(function(){
            var val=$('input:radio[name="search_type"]:checked').val();
            if(val==null){
                $("#navSearchAlert").css({display:"block"});
            }
            else {
                $("#navSearchAlert").css({display:"none"});
            }
        });
//        $("#loginInButton").click(function(){
//            $("#signUpBox").css({display:"none"});
//            $("#loginInBox").css({display:"block"});
//        });
    });

    $(document).ready(function(){
        $(".navHomepageSearchBoxcontainer").mouseover(function(){
            $(".navSearchTypeBox").css({display:"block"});
        });
        $(".navHomepageSearchBoxcontainer").mouseout(function(){
            $(".navSearchTypeBox").css({display:"none"});
        });
    })
    $(document).ready(function(){
        if(<%= @login%>){
            $("#signUpBox").css({display:"none"});
            $("#loginInBox").css({display:"block"});
        }else{
            $("#signUpBox").css({display:"block"});
            $("#loginInBox").css({display:"none"});
        }
    });

//    $('#regist_btn').bind('keyup', function(event) {
//    if (event.keyCode == "13" && $("#signUpBox").css('display') == 'block')) {
//       register();
//    }
//});
    function clearInfo(id, content) {
                var text = $('#' + id);
                if (text.val() == content) {
                    $('#' + id).val('');
                }
            }

    function showInfo(id, content) {
        var text = $('#' + id);
        if (text.val() == '') {
            $('#' + id).val(content);
        }
    }

    function login(){
        $('#main_login_form').submit(); //表单提交没有任何反应的原因：js冲突
    }

    function register(){
        if($login_correct && $mail_correct && $passwd_correct &&  $passwd_comfirm_correct && $("#read_and_confirm").attr("checked") == 'checked'){
            $("#main_reg_form").submit();
        }else{
            $('#user_login').blur();
            $('#user_mail').blur();
            $('#user_password').blur();
            $('#user_password_confirmation').blur();
        }
    }
    var $login_correct = false;
    var $mail_correct = false;
    var $passwd_correct = false;
    var $passwd_comfirm_correct = false;
    jQuery(document).ready(function () {
        var $login = $('#user_login')
        var $mail = $('#user_mail')
        var $password = $('#user_password')
        var $password_confirmation = $('#user_password_confirmation')
        $login.blur(function (event) {
            if ($(this).is('#user_login')) {
                $.get(
                        '<%=account_valid_ajax_path%>',
                        { valid: "login",
                            value: this.value },
                        function (data) {
                            if (data.valid) {
                                $('#login_req').html('<span style="color: green">'+data.message+'</span>');
                                $login_correct = true;
                            } else {
                                $('#login_req').html( '<span style="color: red">'+data.message+'</span>');
                                $login_correct = false;
                            }
                            $('#login_req').css('display','block');
                        });
            }
            ;
        });

        $mail.blur(function (event) {
            if ($(this).is('#user_mail')) {
                $.get('<%=account_valid_ajax_path%>',
                        { valid: "mail",
                            value: this.value },
                        function (data) {
                            if (data.valid) {
                                $('#mail_req').html( '<span style="color: green">'+data.message+'</span>' );
                                 $mail_correct = true;
                            } else {
                                $('#mail_req').html( '<span style="color: red">'+data.message+'</span>' );
                                 $mail_correct = false;
                            }
                            $('#mail_req').css('display','block');
                        });
            }
            ;
        });
        $password.blur(function () {
            var pas1 = document.getElementById("user_password").value;
            var password_min_length = <%= Setting.password_min_length.to_i %>
            if (pas1.length >= password_min_length) {
                $('#passwd_req').html('');
                 $passwd_correct = true;
            }
            else {
                $('#passwd_req').html( '<span style="color: red">'+'<%= l(:setting_password_min_length_limit, :count => Setting.password_min_length.to_i) %>'+'</span>');
                 $passwd_correct = false;
            }
            $('#passwd_req').css('display','block');


        });
        $password_confirmation.blur(function () {
            var password_min_length = <%= Setting.password_min_length.to_i %>
            var pas1 = document.getElementById("user_password").value;
            var pas2 = document.getElementById("user_password_confirmation").value;
            if (pas1.length >= password_min_length && pas1 == pas2 ) {
                $('#confirm_req').html('<span style="color: green">'+'<%= l(:setting_password_success) %>'+'</span>');
                 $passwd_comfirm_correct = true;
            }
            else {
                $('#confirm_req').html('<span style="color: red">'+'<%= l(:setting_password_error) %>'+'</span>');
                 $passwd_comfirm_correct = false;

            }
            $('#confirm_req').css('display','block');



        });
    });

        function user_name_keypress(e){
            if (e.keyCode == '13') {
                $('#main_login_form').submit();
            }
        }
</script>
<div class="loginContentContainer">
  <div class="loginContent">
    <div class="loginLeft">
      <div class="loginLogo"><img src="images/trustie_big_log.png" width="100" height="88" alt="Trustie Logo" /></div>
      <div class="loginInro">欢迎加入Trustie高校创新实践社区！老师、学生和科研人员可以在此开展各种在线协同学习、协同作业、协同开发等活动。Trustie是在中国推行大规模开放在线研究模式（MOORE）的支撑平台。</div>
    </div>
    <div class="loginRight">
      <div id="loginInBox">
        <div class="loginChooseBox">
          <div class="mb5">
          <ul class="loginChooseList">
            <li class="loginChoose fl"><span class="loginChooseTab">登录</span></li>
            <li class="loginChooseBorder fl"></li>
          </ul>
        </div>
        <div class="loginSignAlert" style="color: red"><%= flash.empty? || flash[:error].nil? ? "" : flash[:error].html_safe  %></div>
        </div>
        <div class="loginIn">

          <%= form_tag(signin_path,:id=>'main_login_form',:method=>'post') do %>
          <%= back_url_hidden_field_tag %>
          <div class="mb20">
            <%= text_field_tag 'username', params[:username], :tabindex => '1' ,
                               :class=>'loginSignBox',:placeholder=>'请输入邮箱地址或昵称', :onkeypress => "user_name_keypress(event);"%>
            <!--<input type="text" placeholder="请输入邮箱地址或昵称" class="loginSignBox" />-->
          </div>
          <% if Setting.openid? %>
                  <div class="mb20">
                    <%= text_field_tag "openid_url", nil, :tabindex => '3',:placeholder=>'请输入OpenId URL' %>
                  </div>
          <% end %>
          <div>
            <!--<input type="text" placeholder="请输密码" class="loginSignBox" />-->
            <%= password_field_tag 'password', nil, :tabindex => '2',:class=>'loginSignBox' ,:placeholder=>'请输密码', :onkeypress => "user_name_keypress(event);"%>
          </div>
          <div class="loginSignOption">
            <% if Setting.autologin? %>
                <div class="fl mt3 mr5">
                  <%= check_box_tag 'autologin', 1, true, :tabindex => 4 %>
                </div>
                <%= l(:label_stay_logged_in) %>
            <% end %>
            <a href="<%= lost_password_path %>" class="newsBlue mr40 fr">
              <% if Setting.lost_password? %>
              <u>忘记密码?</u>
                  <% end %>
            </a></div>
        <% end %>
          <div class="loginInButton" >
            <a href="javascript:void(0);" id="login_btn" class="c_white db" onclick="$('#main_login_form').submit();">登录</a>
          </div>

        </div>

      </div>
      <div id="signUpBox">
        <div class="loginChooseBox">
          <ul class="loginChooseList">
            <li class="loginChoose fl"><span class="loginChooseTab">注册<%= link_to l(:label_login_with_open_id_option), signin_url if Setting.openid? %></a></span>
            <li class="loginChooseBorder fl"></li>
          </ul>
        </div>
        <div class="loginIn">
          <%= form_for :user, :url => register_path,:method=>'post',:html=>{:id=>'main_reg_form'} do |f| %>
              <%= error_messages_for 'user' %>
          <div class="loginSignRow">
            <!--<input type="text" placeholder="请输入邮箱地址" class="loginSignBox" />-->
            <%= f.text_field :mail,:size => 25, :class=>'loginSignBox' ,:placeholder=>"请输入邮箱地址"%>
            <div class="loginSignAlert" id="mail_req" style="display: none"  >请输入有效邮箱地址</div>
          </div>
          <div  class="loginSignRow">
            <!--<input type="text" placeholder="请输入密码" class="loginSignBox" />-->
            <%= f.password_field :password, :size => 25,:placeholder=>"请输入密码",:class=>'loginSignBox' %>
            <div class="loginSignAlert" id="passwd_req" style="display: none">至少需要 6 个字符</div>
          </div>
          <div  class="loginSignRow">
            <!--<input type="text" placeholder="请再次输入密码" class="loginSignBox" />-->
            <%= f.password_field :password_confirmation, :size => 25,:placeholder=>"请再次输入密码",:class=>'loginSignBox' %>
            <div class="loginSignAlert" id="confirm_req" style="display: none">密码不一致</div>
          </div>
          <div  class="loginSignRow">
            <!--<input type="text" placeholder="请输入用户昵称" class="loginSignBox" />-->
            <%= f.text_field :login, :size => 25,:placeholder=>"请输入用户昵称",:class=>'loginSignBox'%>
            <div class="loginSignAlert" id="login_req" style="display: none">用户昵称为2-18个中英文，数字或下划线</div>
          </div>
              <div class="loginSignOption">
                <div class="fl mt3 mr5">
                  <input type="checkbox" id="read_and_confirm"/>
                </div>
                我已阅读并接受<a href="<%= agreement_path %>" class="newsBlue"><u>Trustie服务协议</u></a>条款</div>
          <div class="loginUpButton">
            <a href="javascript:void(0);" class="c_white db" id="regist_btn" onclick="register();">注册</a>

          </div>
          <% end %>
        </div>
      </div>
    </div>
    <div class="cl"></div>
  </div>
</div>