Pomoc - Szukaj - Użytkownicy - Kalendarz
Pełna wersja: [JavaScript] Działanie na warstwie
Forum PHP.pl > Forum > Przedszkole
nikestylex7
Witam mam problem. Oba skrypty działają poprawnie lecz zauważyłem pewien mankament między innymi jak mam najechane na pole name a chce jednocześnie coś wpisać np kropke "." to prawidłowo pojawia się border lecz title się nie zmienia zostaje takie jak było. Jak zrobić to live żeby zmieniało się od razu??

link do skryptu

http://jsfiddle.net/JDabW/15/

?

?

Pomoże ktoś bo męczę się z tym przykładem, a tak rozwinięty w jquery to nie jestem.
klapaucius
Plik java script:
  1. $(document).ready(function(){
  2. $("body").on("keyup", function() {
  3. var WzorName = /^[a-z]{3,30}$/i;
  4. var name = $("#name").val();
  5. if (WzorName.test(name))
  6. {
  7. $("#name").attr('title','OK');
  8. $("#name").css('background-image', 'url(images/okicon.png)');
  9. $("#name").css('background-repeat', 'no-repeat');
  10. $("#name").css('background-position', 'right');
  11. $("#name").css('border', '1px solid #d9d9d9');
  12. $("#name").css('border-top', '1px solid #c0c0c0');
  13. } else if($("#name").val() === ""){
  14. $("#name").attr('title','Nie wpisałeś imienia!');
  15. $("#name").css('background-image', 'url(images/okicon.png)');
  16. $("#name").css('background-repeat', 'no-repeat');
  17. $("#name").css('background-position', 'right');
  18. $("#name").css('border', '1px solid red');
  19. }else {
  20. $("#name").attr('title','Wpisałeś niepoprawny znak w pole imię. Dopuszczalne są tylko duże i małe litery polskiego alfabetu np: Żaneta.');
  21. $("#name").css('background-image', 'url(images/okicon.png)');
  22. $("#name").css('background-repeat', 'no-repeat');
  23. $("#name").css('background-position', 'right');
  24. $("#name").css('border', '1px solid red');
  25. }
  26. var titleText = $('#name').attr('title');
  27. $('.tooltip').text(titleText).hide().fadeIn('slow');
  28. });
  29. });
  30.  
  31. $(document).ready(function(){
  32. $('#RegDialogRegister').click(function() {
  33. openDialog('#RegDialog');
  34. });
  35. $('#RegDialog')
  36. .find('.cancel')
  37. .live('click', function() {
  38. closeDialog(this);
  39. })
  40. .end()
  41. .find('.cancel')
  42. .live('click', function() {
  43. // Clicked disagree!
  44. console.log('clicked disagree!');
  45. });
  46. });
  47.  
  48. function openDialog(selector) {
  49. $(selector)
  50. .clone()
  51. .show()
  52. .appendTo('#RegDialogOverlay')
  53. .parent()
  54. .fadeIn('fast');
  55. }
  56.  
  57. function closeDialog( selector ) {
  58. $(selector)
  59. .parents('#RegDialogOverlay')
  60. .fadeOut('fast', function() {
  61. $(this)
  62. .find('.dialog')
  63. .remove();
  64. });
  65. }
  66. $(document).ready(function(){
  67. $("body").on({
  68. mouseenter: function (e) {
  69. var titleText = $(this).attr('title');
  70. $(this).data('tipText', titleText).removeAttr('title');
  71.  
  72. $('<p class="tooltip" style="z-index: 9999;"></p>').fadeIn('slow').text(titleText)
  73. .appendTo('body')
  74. .css('top', (e.pageY - 10) + 'px')
  75. .css('left', (e.pageX + 20) + 'px');
  76. },
  77. mouseleave: function () {
  78. $(this).attr('title', $(this).data('tipText'));
  79. $('.tooltip').remove();
  80. },
  81. mousemove: function (e) {
  82. $('.tooltip')
  83. .css('top', (e.pageY - 10) + 'px')
  84. .css('left', (e.pageX + 20) + 'px');
  85. }
  86. }, '.RegDialogTitle');
  87. });


Dodana linijka 26 i 27.

Oczywiście z animacją się tam jeszcze możesz pobawić, wedle uznania.

Pozdrawiam!
nikestylex7
Wszystko fajnie tylko problem jest w tym że jak najade na name wpisze coś źle np "." komunikat jest fajny a jak zjade z pola name i znowu najade to standardowy komunikat mi pokazuje a nie ten co był dlatego nie wiem jak to rozwiązać wrzucać to w tablice ? i potem odczytywać to no nie wiem aż tak tego nie ogarniam. Może pomożecie ?

?

?

?


?

Pomocy prosze !@#'
To jest wersja lo-fi głównej zawartości. Aby zobaczyć pełną wersję z większą zawartością, obrazkami i formatowaniem proszę kliknij tutaj.
Invision Power Board © 2001-2025 Invision Power Services, Inc.