Přidání css stylu číslům ze scriptu – JavaScript, AJAX, jQuery – Fórum – Programujte.com
 x   TIP: Přetáhni ikonu na hlavní panel pro připnutí webu

Přidání css stylu číslům  ze scriptu – JavaScript, AJAX, jQuery – Fórum – Programujte.comPřidání css stylu číslům ze scriptu – JavaScript, AJAX, jQuery – Fórum – Programujte.com

 

Josef
~ Anonymní uživatel
39 příspěvků
8. 10. 2016   #1
-
0
-

Ahoj, potřeboval bych poradit a nemůžu se nikde dohledat, jak vygenerovaným číslum přiřadit obrázek na pozadí, každému číslu zvlášť. 

A jeste kdyby jste prosim objasnili, co dané časti kodu dělají, tam kde jsem dal , že nerozumím.

.js kod:


HTML:

<p onclick="myFunction()">sem klikni

<p id=demo>  

Javascript:

function myFunction() { var arr = [];

while(arr.length < 2)     {     var randomnumber=Math.ceil(Math.random()*5)      var found=false;                                                                     // .. ? proc prosim false     for(var i=0;i<arr.length;i++)         {                                         // .., ? zde se podminkou opět prochází pole?        if(arr[i]==randomnumber) {                                                     //...?  co prosim znamena tento odstavec, co ma za ukol            

      found=true;            

       break;            

        }         

    if(!found)arr[arr.length]=randomnumber; {                             //...?  tomuto nerozumim    

   document.getElementById("demo").innerHTML = arr;            //...? co vypise toto?

  document.getElementById("demo").style.backgroundImage = url("images/kruh.png"); //nejak takto pridat obrazek kazdemu cislu

}
 

Nahlásit jako SPAM
IP: 78.156.128.–
peter
~ Anonymní uživatel
4016 příspěvků
10. 10. 2016   #2
-
0
-

Domaci ukol do skoly? :) Nespis jsi ve skole spal. Nejspis jsi o prikladu ani nepremyslel.

Ten kod ma naplnit pole nahodnymi cisly tak, aby se neopakovali. (takhle to muze napsat jen nouma, protoze by se mu to mohlo zacyklit do nekonecne smycky, takze to nejspis psal nejaky ucitel a za ukol jsi dostal to upravit; navic vyuzil funkci math.ceil).
Kdyz mas naplnit pole nahodnymi cisly, tak je to jednoduchy cyklus . (pokracuj zdrojovym kodem 1, forko mi to cele nejak zprehazelo pri psani a neda se to jednoduse kopirovat)

2)


 
var pole, i, nalezeno, cislo, prvku, max_random;
pole = [];        // vytvorim prazdne pole
prvku = 2;        // chci 2 cisla (count)
max_random = 5;   // chci aby max cislo bylo (max)

while(pole.length < prvku) // cili, cyklus bude probihat, dokud delka
    // pole bude mensi nez 2 prvky
  {
  cislo = Math.ceil(Math.random() * max_cislo) // vyber nahodne cislo
    // ceil(3) = 3; ceil(3.0001) = 4; ceil(3.9999) = 4
    // takze nahodnych cisel bude >0, coz je ale spatne, proto jsem
    // pouzil floor a max pridal +1
  // mas nahodne cislo a ted potrebujes projit cele pole a zjistit, zda v 
  // nem takove cislo je ci neni. Takze si nejdriv nastavis, ze jsi cislo
  // nenasel a prohledavas. Kdyz ho najdes, nastavis nalezeno = true. Kdyz
  // ne, zustane nalezeno = false
  nalezeno = false;                                                                     
  for(i=0;i<pole.length;i++)
    {
    if(pole[i]==cislo)
      {
      nalezeno = true;            
      break; // prerus cyklus
      }
    } // tady asi nemas zavorku!
  if(nalezeno==false)
    {
    pole[pole.length] = cislo;
    }
  } // a cele to opakuj dokud pocet cisel v poli je 2 (pole.length < prvku)

1)


var i, max, arr, count;
max = 5 + 1;count = 2;
arr   = [];
for(i=0;i<count;i++)
  {
  arr[arr.length] = Math.floor(Math.random() * max);
  // Math.random vraci cislo 0 az 0.9999
  // lze pouzit arr[arr.length] nebo arr[i]
  }

Kdyz si to rozepises, tak to presne dela
max   = 5
count = 2
arr   = nove prazdne pole
---
i = 0
podminka 0<2 (i<count) plati
Math.random() = napr 0,14976
Math.random() * 5 = 0,7488
Math.floor(Math.random() * max) = Math.floor(0,7488) = 0 // floor oreze vse za desetinnou carkou
arr.length = 0
arr[0] = 0 // vysledne pole [0]
---
i++ => i = 1
podminka 1<2 plati
Math.random() = napr 0.65
Math.random() * 5 = 3.25
Math.floor(3.25) = 3
arr.length = 1 // protoze v predchozim kroku jsme do nulte pozice ukladali cislo 0, takze delka pole je ted 1 prvek
arr[1] = 3 // vysledne pole [0, 3]
---
i++ => i = 2
podminka 2<2 neplati, konec cyklu

vysledne pole [0, 3]

Dobre, ale ty tam ted potrebujes cisla tak, aby se neopakovala. Logicky bys postupoval tak, ze do pole priradis cisla 0 az n, zamichas a vyberes prvnich x cisel. Coz je ale narocne na pamet. Pokud ji nemas, tak by sel pouzit i ten uciteluv postup s rizikem, ze to muze treba pocitat 10 let :)
Ok, takze ucitel pouzil postup takovy, ze vybere nahodne cislo. Toto cislo hleda v poli a pokud ho najde, vybere nove nahodne cislo. Pokud nenajde, prida jej do pole.
(pokracuj zdrojovym kodem 2)

(za kodem 2)

document.getElementById("demo").innerHTML = arr;            //...? co vypise toto?
To vypise 'array'. Proc? Protoze pole je pole a nelze ho hned priradit tagu. By tam muselo byt join, alespon. Nebo vypsat konkretni prvek
 = arr; // vypise 'array', proste nesmysl
 = arr.join(', '); // vypise 0, 3
 = arr.join('XXX'); // vypise 0XXX3
 = arr[1]; // vypise 3

document.getElementById("demo").style.backgroundImage = url("images/kruh.png");
// proste nesmysl, nevim, kdes na to prisel; To se da pouzit pro jiny priklad
var obj;
obj = document.getElementById("demo"); // <div id=demo></div>
obj.innerHTML = arr[1]; // vypise 3 (viz predchozi vysvetleni)
obj.innerHTML = '<span>' + arr[1] + '<\/span>'; // vypise <span>3</span>
A k tomu uz neni problem pridat pozadi, ne?

Nahlásit jako SPAM
IP: 2001:718:2601:26c:f056:fd...–
peter
~ Anonymní uživatel
4016 příspěvků
10. 10. 2016   #3
-
0
-

Jo, jeste by mozna stalo zminit pridavani. Predpokladam, ze += neznas

obj.innerHTML = ''; // smaze vse
obj.innerHTML += '<span>' + arr[1] + '<\/span>'; // prida <span>3</span>
obj.innerHTML += '<span>' + arr[0] + '<\/span>'; // prida <span>0</span>

obj.innerHTML += 'text' // je totez jako
obj.innerHTML = obj.innerHTML + 'text'
str += 'text'
str = str + 'text'
Pouzij, co se ti libi vic.

 

Nahlásit jako SPAM
IP: 2001:718:2601:26c:f056:fd...–
Zjistit počet nových příspěvků

Přidej příspěvek

Toto téma je starší jak čtvrt roku – přidej svůj příspěvek jen tehdy, máš-li k tématu opravdu co říct!

Ano, opravdu chci reagovat → zobrazí formulář pro přidání příspěvku

×Vložení zdrojáku

×Vložení obrázku

Vložit URL obrázku Vybrat obrázek na disku
Vlož URL adresu obrázku:
Klikni a vyber obrázek z počítače:

×Vložení videa

Aktuálně jsou podporována videa ze serverů YouTube, Vimeo a Dailymotion.
×
 
Podporujeme Gravatara.
Zadej URL adresu Avatara (40 x 40 px) nebo emailovou adresu pro použití Gravatara.
Email nikam neukládáme, po získání Gravatara je zahozen.
-
Pravidla pro psaní příspěvků, používej diakritiku. ENTER pro nový odstavec, SHIFT + ENTER pro nový řádek.
Sledovat nové příspěvky (pouze pro přihlášené)
Sleduj vlákno a v případě přidání nového příspěvku o tom budeš vědět mezi prvními.
Reaguješ na příspěvek:

Uživatelé prohlížející si toto vlákno

Uživatelé on-line: 0 registrovaných, 20 hostů

 

Hostujeme u Českého hostingu       ISSN 1801-1586       ⇡ Nahoru Webtea.cz logo © 20032024 Programujte.com
Zasadilo a pěstuje Webtea.cz, šéfredaktor Lukáš Churý