##やりたいこと
facebookみたいなページ遷移せずタブで切り替える
新規登録・ログインページを作りたい。
##やってみた結果
（ログイン側）sessions.new.html
<%= form_for(resource, as: resource_name, url: session_path(resource_name)) do |f| %>
<div class="title">LOGIN</div>
<div class="input">
<%= f.label :ユーザーネーム %><br />
<%= f.text_field :username ,autofocus: true %>
<span class="spin"></span>
</div>
<div class="input">
<%= f.label :password %><br />
<%= f.password_field :password, autocomplete: "current-password" %>
</div>
<%= f.submit "Log in", :class =>"btn" %>
<div class="pass-forgot">
<%= render "devise/shared/links" %>
</div>
<% end %>
<div class="material-button alt-2"><span class="shape"></span>
<%= render "devise/registrations/new" %> <!-- 新規登録はrenderで呼び出し -->
（新規登録）_new.html
<%= form_for(resource, as: resource_name, url: registration_path(resource_name)) do |f| %>
<div class="title">REGISTER</div>
<%= devise_error_messages! %>
<div class="input">
<%= f.label :ユーザーネーム %><br />
<%= f.text_field :username ,autofocus: true, autocomplete: "username" %>
</div>
<div class="input">
<%= f.label :Email %><br />
<%= f.email_field :email, autofocus: true, autocomplete: "email" %>
</div>
<div class="input">
<label for="reregpass">Password</label>
<%= f.password_field :password, autocomplete: "new-password" %>
</div>
<div class="input">
<%= f.label :RepeatPassword %><br/>
<%= f.password_field :password_confirmation, autocomplete: "new-password" %>
</div>
<% end %>
余計な部分は削除してますが概ね上記のように記述して実行。
新規登録時はユーザー名、パスワード、アドレスを入力、
ログイン時はユーザ名とパスワードのみ入力、の仕様。
結果・・・
Found 2 elements with non-unique id
上記のようなエラーメッセージが出てうまく動作しない。
（入力内容があっていてもログインできない）
調べたみたところ、deviseを使う際に入力する
<%= f.text_field :username ,autofocus: true, autocomplete: "username" %>
この記述によって出力されるid（id=usernameと勝手に入る）が重複しているためエラーが発生する模様。
（上記で2 elementsとなっているのは、入力内容が被っているユーザー名とパスワードの２つ）
#解決方法
（ログイン側）sessions.new.html
<head>
<script>
$(function() { $('input').removeAttr('id')});
$(function() { $('form').removeAttr('id')});
</script>
</head>
jQueryを利用して上記のように記述し、
<body>読み込み前にform inputタグがもつid要素を外せばOK
これだけ！