更有效地编写这个javascript的方法

前端之家收集整理的这篇文章主要介绍了更有效地编写这个javascript的方法前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
我正在为我的网站创建一个联系表单,并在提交之前使用 javascript进行第一层验证,然后通过PHP再次检查,但我是相对较新的javascript,这是我的脚本…
  1. $("#send").click(function() {
  2. var fullname = $("input#fullname").val();
  3. var email = $("input#email").val();
  4. var subject = $("input#subject").val();
  5. var message = $("textarea#message").val();
  6. if (fullname == ""){
  7. $("input#fullname").css("background","#d02624");
  8. $("input#fullname").css("color","#121212");
  9. }else{
  10. $("input#fullname").css("background","#121212");
  11. $("input#fullname").css("color","#5c5c5c");
  12. }
  13. if (email == ""){
  14. $("input#email").css("background","#d02624");
  15. $("input#email").css("color","#121212");
  16. }else{
  17. $("input#email").css("background","#121212");
  18. $("input#email").css("color","#5c5c5c");
  19. }
  20. if (subject == ""){
  21. $("input#subject").css("background","#d02624");
  22. $("input#subject").css("color","#121212");
  23. }else{
  24. $("input#subject").css("background","#121212");
  25. $("input#subject").css("color","#5c5c5c");
  26. }
  27. if (message == ""){
  28. $("textarea#message").css("background","#d02624");
  29. $("textarea#message").css("color","#121212");
  30. }else{
  31. $("textarea#message").css("background","#121212");
  32. $("textarea#message").css("color","#5c5c5c");
  33. }
  34. if (name && email && subject && message != ""){
  35. alert("YAY");
  36. }
  37. });

如果所有字段都填写完整,我怎样才能更有效地写这个并发出警报显示,谢谢.

解决方法

  1. $("#send").click(function() {
  2. var Failed = false;
  3.  
  4. $('input#fullname,input#email,input#subject,textarea#message').each(function() {
  5. var item = $(this);
  6. if (item.val()) {
  7. item.css("background","#121212").css("color","#5c5c5c");
  8. } else {
  9. item.css("background","#d02624").css("color","#121212");
  10. Failed = true;
  11. }
  12. });
  13.  
  14. if (Failed){
  15. alert("YAY");
  16. }
  17. });

猜你在找的JavaScript相关文章