Автор Тема: Проблем с JavaScript код  (Прочетена 2752 пъти)

NikolaiTalev

  • Напреднали
  • *****
  • Публикации: 307
  • Distribution: Debian Wheezy
  • Window Manager: KDE
    • Профил
    • WWW
Проблем с JavaScript код
« -: Jan 11, 2011, 10:25 »
Здравейте снощи цяла вечер си блъсках главата с тоя код и не мога да разбера защо не се получава  ???

Код
GeSHi (Javascript):
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
  2. <html><head><meta http-equiv="Content-Type" content="text/html; charset=udF-8">
  3. <title>...</title>
  4. <style type="text/css">
  5.  
  6. </style>
  7.  
  8. <script language="javascript" type="text/javascript">
  9.  
  10. function limitText(key, limitField, limitCount, limitNum)
  11. {
  12. if (key == 32 || key == 13){
  13. alert("You just pressed a key");}//tuka trqbva da restartira funciqta
  14. else{
  15. if (limitField.value.length > limitNum) {
  16. limitField.value = limitField.value.substring(0, limitNum);
  17. } else {
  18. limitCount.value = limitNum - limitField.value.length;
  19. }
  20. }
  21. }
  22. </script>
  23.  
  24. </head>
  25. <body>
  26. <form name="myform">
  27. <textarea name="limitedtextarea" onKeyPress="limitText(window.event.keyCode);" onKeyDown="limitText(this.form.limitedtextarea,this.form.countdown,10);"
  28. onKeyUp="limitText(this.form.limitedtextarea,this.form.countdown,10);">
  29. </textarea><br>
  30. <font size="1">(Maximum characters: 10)<br>
  31. You have <input readonly type="text" name="countdown" size="3" value="10"> characters left.</font>
  32. </form>
  33. </body>
  34. </html>  

Така засича space end enter
Проблема е че ако key най- отпред (function limitText(key, limitField, limitCount, limitNum) ) изважда аррлета т.е засича  space-a, но тогава не работи останалата част (проверката за дължината)

П.П
Цитат
Идеята е следната искам да огранича дължината на въведената дума, тоест
докато се въвежда текста примерно съм задал 40 символа  в момента който се натисне space || enter да започва от начало (тоест да брои символите на всяка дума)

Edit:alert("You just pressed a key"); алерта съм го сложил само с цел визуализация за натискането на клавиш enter || space иначе там трябва да рестартира функцията  limitText
« Последна редакция: Jan 11, 2011, 10:41 от NilkolaiTalev »
Активен

Веднъж Linux, цял живот Linux.

http://blog.nk-support.eu/

neter

  • Global Moderator
  • Напреднали
  • *****
  • Публикации: 3408
  • Distribution: Debian, SailfishOS, CentOS
  • Window Manager: LXDE, Lipstick
    • Профил
    • WWW
Re: Проблем с JavaScript код
« Отговор #1 -: Jan 11, 2011, 12:12 »
Зарежи го чистия javascript - само ще си навлечеш главоболия. Пример, "window.event" го няма във Firefox (и много други браузъри). Трябва да изписваш алтернативи според браузъра, което е куцо. Препоръчвам ти да почнеш да четеш за jQuery (ако мислиш да се занимаваш с javascript и в бъдеще).
По твоя проблем. Ето пример как може да стане с jQuery
Код
GeSHi (HTML):
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
  2. <html><head><meta http-equiv="Content-Type" content="text/html; charset=udF-8">
  3. <title>...</title>
  4. <script src="път/до/jquery.js"></script>
  5. <script src="път/до/textlimit.js"></script>
  6. <style type="text/css">
  7. </head>
  8. <form name="myform">
  9. <textarea id="limitedtextarea" name="limitedtextarea"></textarea><br>
  10. <font size="1">(Maximum characters: 10)<br>
  11. You have <span class="countdown"></span> characters left.</font>
  12. </form>
  13. <script type="text/javascript">
  14. $("#limitedtextarea").textlimit("span.countdown",10,-1);
  15. </body>
  16. </html>
Това е сайтът на jQuery, откъдето можеш да си дръпнеш библиотеката на jQuery, която вмъкваме в head-a. Това е страничката, откъдето можеш да си дръпнеш плъгина Text Limit за jQuery, който също можеш да забележиш вмъкнат в head-a. Javascript-ът в дъното на кода говори сам за себе си в jQuery синтаксис. Само ще ти кажа, че "-1" указва потребителят да не вижда изпълнението на ограничението, когато в полето е поставен текст, по-дълъг от ограничението. Ако искаш изрязването на текста да се вижда, замени "-1" със скоростта на изрязване в милисекунди (например 100).
При така вече направен добър ограничител на текста, обясни по-добре какво трябва да се случва при натискане на интервал или Enter, за какво са тези alert-и и т.н.
Активен

"Да си добре приспособен към болно общество не е признак за добро здраве" - Джиду Кришнамурти

bvbfan

  • Напреднали
  • *****
  • Публикации: 1056
  • Distribution: KaOS
  • Window Manager: Plasma 5
    • Профил
Re: Проблем с JavaScript код
« Отговор #2 -: Jan 11, 2011, 12:34 »
Цитат
onKeyDown="limitText(this.form.limitedtextarea,this.form.countdown,10);
function limitText(key, limitField, limitCount, limitNum)
Викаш функция, която приема 4 параметъра, а я викаш с 3, което обърква цялата логика и скрипта не се изпълнява, заради недефинирани символи.

Код:
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html><head><meta http-equiv="Content-Type" content="text/html; charset=udF-8">
<title>...</title>
<style type="text/css">
 
</style>
 
<script language="javascript" type="text/javascript">
 
function limitText(key, limitCount, limitNum)
{
  if (key.value.length >= limitNum) {
    key.value = key.value.substring(0, limitNum);
  }
  limitCount.value = limitNum - key.value.length;
}
</script>
 
</head>
<body>
<form name="myform">
<textarea name="limitedtextarea" onKeyUp="limitText(this.form.limitedtextarea,this.form.countdown,10);"
onKeyPress="limitText(this.form.limitedtextarea,this.form.countdown,10);">
</textarea><br>
<font size="1">(Maximum characters: 10)<br>
You have <input readonly type="text" name="countdown" size="3" value="10"> characters left.</font>
</form>
</body>
</html>   

Разгледай този код, не съм javascript програмист, може да написано невярно, но в Лисицата работи.
Активен

NikolaiTalev

  • Напреднали
  • *****
  • Публикации: 307
  • Distribution: Debian Wheezy
  • Window Manager: KDE
    • Профил
    • WWW
Re: Проблем с JavaScript код
« Отговор #3 -: Jan 11, 2011, 13:53 »
Зарежи го чистия javascript - само ще си навлечеш главоболия. Пример, "window.event" го няма във Firefox (и много други браузъри). Трябва да изписваш алтернативи според браузъра, което е куцо. Препоръчвам ти да почнеш да четеш за jQuery (ако мислиш да се занимаваш с javascript и в бъдеще).
По твоя проблем. Ето пример как може да стане с jQuery
Код
GeSHi (HTML):
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
  2. <html><head><meta http-equiv="Content-Type" content="text/html; charset=udF-8">
  3. <title>...</title>
  4. <script src="път/до/jquery.js"></script>
  5. <script src="път/до/textlimit.js"></script>
  6. <style type="text/css">
  7. </head>
  8. <form name="myform">
  9. <textarea id="limitedtextarea" name="limitedtextarea"></textarea><br>
  10. <font size="1">(Maximum characters: 10)<br>
  11. You have <span class="countdown"></span> characters left.</font>
  12. </form>
  13. <script type="text/javascript">
  14. $("#limitedtextarea").textlimit("span.countdown",10,-1);
  15. </body>
  16. </html>
Това е сайтът на jQuery, откъдето можеш да си дръпнеш библиотеката на jQuery, която вмъкваме в head-a. Това е страничката, откъдето можеш да си дръпнеш плъгина Text Limit за jQuery, който също можеш да забележиш вмъкнат в head-a. Javascript-ът в дъното на кода говори сам за себе си в jQuery синтаксис. Само ще ти кажа, че "-1" указва потребителят да не вижда изпълнението на ограничението, когато в полето е поставен текст, по-дълъг от ограничението. Ако искаш изрязването на текста да се вижда, замени "-1" със скоростта на изрязване в милисекунди (например 100).
При така вече направен добър ограничител на текста, обясни по-добре какво трябва да се случва при натискане на интервал или Enter, за какво са тези alert-и и т.н.

@neter благодаря ти много , искам докато потребителя въвежда текста при всяко натискане на space or enter да започва да брои от начало (тоест искам да определя максималната дължина на една дума )
Активен

Веднъж Linux, цял живот Linux.

http://blog.nk-support.eu/

bvbfan

  • Напреднали
  • *****
  • Публикации: 1056
  • Distribution: KaOS
  • Window Manager: Plasma 5
    • Профил
Re: Проблем с JavaScript код
« Отговор #4 -: Jan 11, 2011, 15:10 »
Код
GeSHi (HTML):
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
  2. <html><head><meta http-equiv="Content-Type" content="text/html; charset=udF-8">
  3. <title>...</title>
  4. <style type="text/css">
  5.  
  6.  
  7. <script language="javascript" type="text/javascript">
  8.  
  9. function limitText(e, key, limitCount, limitNum)
  10. {
  11.  if( e.which == 32 || e.which == 13 )
  12.  {
  13.    key.value = "";
  14.  }
  15.  else
  16.  if (key.value.length >= limitNum) {
  17.    key.value = key.value.substring(0, limitNum);
  18.  }
  19.  limitCount.value = limitNum - key.value.length;
  20. }
  21.  
  22. </head>
  23. <form name="myform">
  24. <textarea name="limitedtextarea" onKeyPress="limitText(event,this.form.limitedtextarea,this.form.countdown,10);"
  25. onKeyUp="limitText(event,this.form.limitedtextarea,this.form.countdown,10);">
  26. <font size="1">(Maximum characters: 10)<br>
  27. You have <input readonly type="text" name="countdown" size="3" value="10"> characters left.</font>
  28. </form>
  29. </body>
  30. </html>
  31.  
Активен

NikolaiTalev

  • Напреднали
  • *****
  • Публикации: 307
  • Distribution: Debian Wheezy
  • Window Manager: KDE
    • Профил
    • WWW
Re: Проблем с JavaScript код
« Отговор #5 -: Jan 11, 2011, 15:58 »
Код
GeSHi (HTML):
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
  2. <html><head><meta http-equiv="Content-Type" content="text/html; charset=udF-8">
  3. <title>...</title>
  4. <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
  5. <script type="text/javascript" src="textlimit.js"></script>
  6. <style type="text/css">
  7. </head>
  8. <body onKeyPress="doKey(window.event.keyCode);">
  9. <form name="myform">
  10. <textarea id="limitedtextarea" name="limitedtextarea" ></textarea><br>
  11. <font size="1">(Maximum characters: 100)<br>
  12. You have <span class="countdown"></span> characters left.</font>
  13. </form>
  14. <script type="text/javascript">
  15. function doKey(key)
  16. {
  17. if (key == 32 || key == 13){
  18. $("#limitedtextarea").textlimit("span.countdown",50,-1);}//тук трябва да рестартирам брояча
  19. else {$("#limitedtextarea").textlimit("span.countdown",50,-1);}
  20. }
  21. </body>
  22. </html>

@neter как мога да рестартирам брояча тоест пиша .... и като натисна ентер или спейс да почва пак от 50символа
Активен

Веднъж Linux, цял живот Linux.

http://blog.nk-support.eu/

neter

  • Global Moderator
  • Напреднали
  • *****
  • Публикации: 3408
  • Distribution: Debian, SailfishOS, CentOS
  • Window Manager: LXDE, Lipstick
    • Профил
    • WWW
Re: Проблем с JavaScript код
« Отговор #6 -: Jan 11, 2011, 17:01 »
Извинявай за забавянето, трябва и да се работи :) За целите на твоето упражнение може да окастрим и променим кода на плъгина Text Limit на jQuery така:
Код
GeSHi (Javascript):
  1. jQuery.fn.textlimit=function(counter_el, thelimit) {
  2. var that = this[0];
  3. updateCounter();
  4.  
  5. function updateCounter(){
  6.                words = that.value.split(/[\s]+/);
  7.                var wordCharCount = words[words.length-1].length;
  8. jQuery(counter_el).text(thelimit - wordCharCount);
  9. };
  10.  
  11. this.keyup (function(e){
  12. updateCounter();
  13.                for (i=0;i<words.length;i++) {
  14.        if( words[i].length > thelimit ){
  15.        this.value = this.value.replace(words[i], words[i].substr(0,thelimit));
  16.        }
  17.                }
  18.                updateCounter();
  19. });
  20. };
HTML-ът си остава такъв, какъвто ти го показах в по-горния ми пост, като само махни третия параметър от функцията textlimit ;)

P.S.: Броячът под textarea-та ще показва оставащите символи за последната дума в текста. Надявам се да ти върши работа така, тъй като за момента не ми хрумва как ще стане логиката да показваме броя на текущо редактираната дума от текста (може да не е последната). Но пък току виж ми хрумнало :)
« Последна редакция: Jan 12, 2011, 10:49 от neter »
Активен

"Да си добре приспособен към болно общество не е признак за добро здраве" - Джиду Кришнамурти

NikolaiTalev

  • Напреднали
  • *****
  • Публикации: 307
  • Distribution: Debian Wheezy
  • Window Manager: KDE
    • Профил
    • WWW
Re: Проблем с JavaScript код
« Отговор #7 -: Jan 11, 2011, 17:13 »
Мерси много получаваш цяла каса виртуална бира  [_]3 
Не съм спал снощи да го мисля ама явно ще трябва да попрочета някое  букварче за jQuery. Аз попринцип на php пиша и до сега не ми се е налагало да си пиша js за каквото ми е трябвало сам намирал готов. Сега ми остана само с php  да направя проверката ако е изключен js да не записва в база даните (за да не заобиколи някой проверката )


Активен

Веднъж Linux, цял живот Linux.

http://blog.nk-support.eu/