2016-08-22 123 views
0

我目前正在設計一個註冊頁面,文本旁邊的字段根據用戶選擇的輸入而改變。爲什麼我的註冊頁面不能使用.focus()方法?

$(function() { 
    $('input').on('change', function() { 
    var input = $(this); 
    if (input.val().length) { 
     input.addClass('populated'); 
    } else { 
     input.removeClass('populated'); 
    } 
    }); 
}); 
$(".namewrapper").click(function() { 
    $("#fname").focusin(); 
}); 
$("#fname").focusin(function() { 
    $(".signup").fadeOut(200, function() { 
    $(".signup").text("Phase 1"); 
    $(".introduction").fadeOut(200, function() { 
     $(".introduction").text("To start, go ahead and enter your name."); 
    }); 
    $(".signup").fadeIn(200); 
    $(".introduction").fadeIn(200); 
    }); 
}); 
$(".usernamewrapper").click(function() { 
    $("#username").focus(); 
}); 
$("#username").focus(function() { 
    $(".signup").fadeOut(200, function() { 
    $(".signup").text("Phase 2"); 
    $(".introduction").fadeOut(200, function() { 
     $(".introduction").text("Now, what would you like your username to be?"); 
     $(".introduction").fadeIn(200); 
    }); 
    $(".signup").fadeIn(200); 
    }); 
}); 
$(".emailwrapper").click(function() { 
    $("#emailfield").focus(); 
}); 
$("#emailfield").focus(function() { 
    $(".signup").fadeOut(200, function() { 
    $(".signup").text("Phase 3"); 
    $(".introduction").fadeOut(200, function() { 
     $(".introduction").text("What email shall we use?"); 
     $(".introduction").fadeIn(200); 
    }); 
    $(".signup").fadeIn(200); 
    }); 
}); 
$(".password1wrapper").click(function() { 
    $("#password1").focus(); 
}); 
$("#password1").focus(function() { 
    $(".signup").fadeOut(200, function() { 
    $(".signup").text("Phase 4"); 
    $(".introduction").fadeOut(200, function() { 
     $(".introduction").text("Make sure your password is rememberable and isn't short!"); 
     $(「.introduction」).append(「 < i class = 「em em - key」 > < /i>」); 
      $(".introduction").fadeIn(200); 
      }); 
     $(".signup").fadeIn(200); 
     }); 
    }); 
    $(".password2wrapper").click(function() { 
     $("#password2").focus(); 
    }); 
    $("#password2").focus(function() { 
     $(".signup").fadeOut(200, function() { 
     $(".signup").text("Phase 5"); 
      $(".introduction").fadeOut(200, function() { 
      $(".introduction").text("Retype your password."); 
      $(「.introduction」).append(「<i class=「em em-key」></i > 」); 
     $(".introduction").fadeIn(200); 
    }); 
    $(".signup").fadeIn(200); 
    }); 
}); 

正如你所看到的,根據他們選擇的字段(或包含div),指令會改變。當我只有一個字段的函數時,這工作正常,但只要我爲其餘的函數添加函數,指令就不會改變。任何幫助感謝!

+0

你應該在'$(function(){...})裏面有所有的事件綁定' – Barmar

+0

這似乎沒有改變任何東西@Barmar –

+0

你的代碼中有一些引號而不是ASCII雙引號: '$(「。introduction」)。append(「< /i>」);'。這只是一個複製錯誤,還是它在真正的代碼? Javascript控制檯中是否有任何錯誤? – Barmar

回答

0

從控制檯中找出它,結果證明它沒有正確處理.append()函數。刪除後,我發現在文件末尾有額外的結束語句。

相關問題