Pexeso jQuery – JavaScript, AJAX, jQuery – Fórum – Programujte.com
 x   TIP: Přetáhni ikonu na hlavní panel pro připnutí webu
Reklama

Pexeso jQuery – JavaScript, AJAX, jQuery – Fórum – Programujte.comPexeso jQuery – JavaScript, AJAX, jQuery – Fórum – Programujte.com

 

Spuštěný nový filmový web Filmožrouti.cz — vše o Avengers, Pacific Rim, Thor, Star Wars…
Kobe_
~ Anonymní uživatel
4 příspěvky
14. 5. 2018   #1
-
0
-

Ahoj, jsem naprostej amatér v jQuery. Snažím se učit na tvorbě pexesa, chtěl bych se zeptat jestli je v následujícím kódu možnost aby dvojici tvořili dva rozdílné obrázky, tudíž obrázky s podobným názvem. Například autobus.png a autobusA.png.

Děkuji za odpovědi


<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<title>JQuery Memory Game</title>
<script type="text/javascript">
var boxopened = "";
var imgopened = "";
var count = 0;
var found = 0;
function randomFromTo(from, to){
return Math.floor(Math.random() * (to - from + 1) + from);
}
function shuffle() {
var children = $("#boxcard").children();
var child = $("#boxcard div:first-child");
var array_img = new Array();
for (i=0; i<children.length; i++) {
array_img[i] = $("#"+child.attr("id")+" img").attr("src");
child = child.next();
}
var child = $("#boxcard div:first-child");
for (z=0; z<children.length; z++) {
randIndex = randomFromTo(0, array_img.length - 1);
// set new image
$("#"+child.attr("id")+" img").attr("src", array_img[randIndex]);
array_img.splice(randIndex, 1);
child = child.next();
}
}
function resetGame() {
shuffle();
$("img").hide();
$("img").removeClass("opacity");
count = 0;
$("#msg").remove();
$("#count").html("" + count);
boxopened = "";
imgopened = "";
found = 0;
return false;
}
$(document).ready(function() {
$("img").hide();
$("#boxcard div").click(openCard);
shuffle();
function openCard() {
id = $(this).attr("id");
if ($("#"+id+" img").is(":hidden")) {
$("#boxcard div").unbind("click", openCard);
$("#"+id+" img").slideDown('fast');
if (imgopened == "") {
boxopened = id;
imgopened = $("#"+id+" img").attr("src");
setTimeout(function() {
$("#boxcard div").bind("click", openCard)
}, 300);
} else {
currentopened = $("#"+id+" img").attr("src");
if (imgopened != currentopened) {
// close again
setTimeout(function() {
$("#"+id+" img").slideUp('fast');
$("#"+boxopened+" img").slideUp('fast');
boxopened = "";
imgopened = "";
}, 400);
} else {
// found
$("#"+id+" img").addClass("opacity");
$("#"+boxopened+" img").addClass("opacity");
found++;
boxopened = "";
imgopened = "";
}
setTimeout(function() {
$("#boxcard div").bind("click", openCard)
}, 400);
}

count++;
$("#count").html("" + count);
if (found == 10) {
msg = '<span id="msg">Congrats ! You Found All Sushi With </span>';
$("span.link").prepend(msg);
}
}
}
});
</script>
<style type="text/css">
* {
font-family: Arial, "Free Sans";
}
#boxcard {
margin: 0 auto;
width: 1200px;
z-index: 1;
}
#boxcard div {
float: left;
width: 150px;
height: 150px;
background-image: url("ZadniStrana.png");
background-size: 160px 160px;
background-repeat: no-repeat;
margin: 5px;
padding: 5px;
border: 1px solid #999;
cursor: pointer;
-webkit-border-radius: .5em;
-moz-border-radius: .5em;
border-radius: .5em;
-webkit-box-shadow: 0 1px 2px rgba(0,0,0,.5);
-moz-box-shadow: 0 1px 2px rgba(0,0,0,.5);
box-shadow: 0 1px 2px rgba(0,0,0,.5);
z-index: 2;
}
#boxcard div img {
border: none;
z-index: 3;
}
.opacity {
opacity: .6;
filter: alpha(opacity=60);
}
#boxbutton {
text-align: center;
padding: 20px;
}
.link {
font-size: 18px;
color: #ffffff;
text-decoration: none;
background: #0066cc;
padding: 5px 10px;
-webkit-border-radius: .5em;
-moz-border-radius: .5em;
border-radius: .5em;
}
.link:hover {
background: #999;
}
</style>
</head>
<body>
<div id="boxbutton">
<span class="link">
<span id="count">0</span>
Click
</span>
&nbsp;
<a rel="nofollow" href="javascript:" class="link" onclick="resetGame();">Reset</a>
</div>
<div id="boxcard">
<div id="card1"><img src="img/autobus.png"/></div>
<div id="card2"><img src="img/02.jpg" /></div>
<div id="card3"><img src="img/03.jpg" /></div>
<div id="card4"><img src="img/04.jpg" /></div>
<div id="card5"><img src="img/05.jpg"/></div>
<div id="card6"><img src="img/06.jpg"/></div>
<div id="card7"><img src="img/07.jpg" /></div>
<div id="card8"><img src="img/08.jpg" /></div>
<div id="card9"><img src="img/09.jpg" /></div>
<div id="card10"><img src="img/10.jpg"/></div>
<div id="card11"><img src="img/autobusA.png"/></div>
<div id="card12"><img src="img/02.jpg"/></div>
<div id="card13"><img src="img/03.jpg"/></div>
<div id="card14"><img src="img/04.jpg"/></div>
<div id="card15"><img src="img/05.jpg"/></div>
<div id="card16"><img src="img/06.jpg"/></div>
<div id="card17"><img src="img/07.jpg"/></div>
<div id="card18"><img src="img/08.jpg"/></div>
<div id="card19"><img src="img/09.jpg"/></div>
<div id="card20"><img src="img/10.jpg"/></div>
</div>
</body>
</html>
 

Nahlásit jako SPAM
IP: 160.217.133.–
peter
~ Anonymní uživatel
3286 příspěvků
14. 5. 2018   #2
-
0
-

Ne.

currentopened = $("#"+id+" img").attr("src");
if (imgopened != currentopened) {
// close again

Nahlásit jako SPAM
IP: 2001:718:2601:258:b4d2:9f...–
peter
~ Anonymní uživatel
3286 příspěvků
14. 5. 2018   #3
-
0
-

Takhle, mozna spatne polozena otazka.
V tom kodu, cos poslal, to mozne neni. Musel bys ho upravit. Konkretne by stacilo prepsat tu podminku na dve.
x==y
x==y+'A' || x+'A'==y ... zjednodusene
Ale protoze prepisujes src a to A neni na konci (soubor.jpg, soubor.jpgA nee, mas souborA.jpg), tak bys tam musel pridat nejake str.substr() nebo by mozna stacilo split('.') nebo str.replace() (smazat spriponu, vse za teckou) . Proste by se to o neco vice zkomplikovalo.

Nahlásit jako SPAM
IP: 2001:718:2601:258:b4d2:9f...–
Kobe_
~ Anonymní uživatel
4 příspěvky
14. 5. 2018   #4
-
0
-

Upravit/změnit nějak ten porovnávací atribut by nefungovalo? Fakt jsem absolutní začátečník takže zatím moc nechápu jak to přesně funguje.

Nahlásit jako SPAM
IP: 178.255.168.–
gna
~ Anonymní uživatel
619 příspěvků
14. 5. 2018   #5
-
0
-

Už ti peter napsal, kde ten test je. Uprav si to jak chceš.

if (imgopened != currentopened) {
// close again
...
} else {
// found
...
Nahlásit jako SPAM
IP: 213.211.51.–
Kobe_
~ Anonymní uživatel
4 příspěvky
14. 5. 2018   #6
-
0
-

můžete mi sem prosím někdo hodit řešení na názvech souboru nezaleží jen aby dva rozdílný obrátky prostě utvořili dvojici. Byl bych vám velmi zavázán

Nahlásit jako SPAM
IP: 178.255.168.–
peter
~ Anonymní uživatel
3286 příspěvků
15. 5. 2018   #7
-
0
-

'moc nechápu jak to přesně funguje'

Pri otoceni prvni karticky ulozi src do promenne imgopened.
imgopened = $("#"+id+" img").attr("src"); // <img src="img/autobus.png"/>

Pri otoceni druhe karticky ulozi src do promenne currentopened.
currentopened = $("#"+id+" img").attr("src"); // <img src="img/autobusA.png"/>

Shodu pak porovnava na radku
if (imgopened != currentopened) {

Cili, to porovnavani bys musel opravit. Asi nejjednodussi odstranit pripony '.jpg' a pridat 'A' a podminku duplikovat. Abys dostal neco takoveho: 

x==y+'A' || x+'A'==y // pro tvuj pripad v negaci...
!(x==y+'A' || x+'A'==y)

x = odstranPriponu(imgopened); // 'img/autobus.png' => 'img/autobus'
y = odstranPriponu(currentopened); // 'img/autobusA.png' => 'img/autobusA'
if (!(x==y+'A' || x+'A'==y)) {
// 'img/autobus'=='img/autobusA'+'A' => 'img/autobus'=='img/autobusAA' => false
// 'img/autobus'+'A'=='img/autobusA' => 'img/autobusA'=='img/autobusA' => true
// false || true => true
// !true => false

// Puvodni podminka byla take v negaci
imgopened != currentopened // totez jako
!(imgopened == currentopened)
// img/01.jpg==img/01.jpg => true
// img/autobus.png==img/autobusA.png => false

'někdo hodit řešení'
Takhle bohuzel forko nefunguje. Je jasne videt nulova snaha, nulovy zajem ukol sam vyresit. To odrazuje lidi od jakekoliv pomoci cizi osobe. Navic zadarmo a navic skolni uloha pro ZS. Teda, jestli jsi uz postrehl, ze se zacina informatika ucit na ZS :)

Nahlásit jako SPAM
IP: 2001:718:2601:258:8cd1:96...–
Kobe_
~ Anonymní uživatel
4 příspěvky
15. 5. 2018   #8
-
0
-

Díky, už jsem to vyřešil

if (imgopened.replace(/[^[0-9]/g,"") != currentopened.replace(/[^[0-9]/g,"")) {

Jinak chápu, nicméně jsem programováním nepolíbený takže mám obrovský rezervy. Nevím jak u vás, ale u nás na ZŠ i SŠ, se jQuery ani Javascript určitě nevyučoval. Pokud k tomu dochází nyní jedině dobře pro mladé ročníky.

Přesto ti děkuji za snahu.

Nahlásit jako SPAM
IP: 178.255.168.–
peter
~ Anonymní uživatel
3286 příspěvků
15. 5. 2018   #9
-
0
-

Ten regularni vyraz maze vse, krome cisel. Zalezi na tom, jak mas ty soubory pojmenovane, pak by to mohlo fungovat (cokoliv01.jpg, cokoliv01A.jpg => 01, 01). Jeste jednodussi, nez jsem navrhoval :)

Nahlásit jako SPAM
IP: 2001:718:2601:258:8cd1:96...–
e
~ Anonymní uživatel
140 příspěvků
před 16 hodinami   #10
-
0
-

Nahlásit jako SPAM
IP: 42.49.180.–
e
~ Anonymní uživatel
140 příspěvků
před 14 hodinami   #11
-
0
-

1'"

Nahlásit jako SPAM
IP: 42.49.180.–
e
~ Anonymní uživatel
140 příspěvků
před 14 hodinami   #12
-
0
-

\

Nahlásit jako SPAM
IP: 42.49.180.–
e
~ Anonymní uživatel
140 příspěvků
před 14 hodinami   #13
-
0
-

@@UcuIm

Nahlásit jako SPAM
IP: 42.49.180.–
e
~ Anonymní uživatel
140 příspěvků
před 14 hodinami   #14
-
0
-

JyI=

Nahlásit jako SPAM
IP: 42.49.180.–
e
~ Anonymní uživatel
140 příspěvků
před 14 hodinami   #15
-
0
-

(select convert(int,CHAR(65)))

Nahlásit jako SPAM
IP: 42.49.180.–
e
~ Anonymní uživatel
140 příspěvků
před 14 hodinami   #16
-
0
-

  • 1'"

Nahlásit jako SPAM
IP: 42.49.180.–
e
~ Anonymní uživatel
140 příspěvků
před 14 hodinami   #17
-
0
-

  • \

Nahlásit jako SPAM
IP: 42.49.180.–
e
~ Anonymní uživatel
140 příspěvků
před 14 hodinami   #18
-
0
-

  • 1À§À¢

Nahlásit jako SPAM
IP: 42.49.180.–
e
~ Anonymní uživatel
140 příspěvků
před 14 hodinami   #19
-
0
-

  • @@nZIBY

Nahlásit jako SPAM
IP: 42.49.180.–
e
~ Anonymní uživatel
140 příspěvků
před 14 hodinami   #20
-
0
-

  • JyI=

Nahlásit jako SPAM
IP: 42.49.180.–
e
~ Anonymní uživatel
140 příspěvků
před 14 hodinami   #21
-
0
-

  • ¿'¿"

Nahlásit jako SPAM
IP: 42.49.180.–
e
~ Anonymní uživatel
140 příspěvků
před 14 hodinami   #22
-
0
-

  • ð''ð""

Nahlásit jako SPAM
IP: 42.49.180.–
e
~ Anonymní uživatel
140 příspěvků
před 14 hodinami   #23
-
0
-

  • (select convert(int,CHAR(65)))

Nahlásit jako SPAM
IP: 42.49.180.–
e
~ Anonymní uživatel
140 příspěvků
před 14 hodinami   #24
-
0
-

%3Cblockquote%3E%0A%3Cul%3E%0A%09%3Cli%3E%3Cstrong%3E%3Cem%3E%3Cu%3E%3Cstrike%3E%E2%80%8B%E2%80%8B%E2%80%8B%3C%2Fstrike%3E%3C%2Fu%3E%3C%2Fem%3E%3C%2Fstrong%3E%3C%2Fli%3E%0A%3C%2Ful%3E%0A%3C%2Fblockquote%3E%0A

Nahlásit jako SPAM
IP: 42.49.180.–
e
~ Anonymní uživatel
140 příspěvků
před 14 hodinami   #25
-
0
-

%3Cblockquote%3E%0A%3Cul%3E%0A%09%3Cli%3E%3Cstrong%3E%3Cem%3E%3Cu%3E%3Cstrike%3E%E2%80%8B%E2%80%8B%E2%80%8B%3C%2Fstrike%3E%3C%2Fu%3E%3C%2Fem%3E%3C%2Fstrong%3E%3C%2Fli%3E%0A%3C%2Ful%3E%0A%3C%2Fblockquote%3E%0A

Nahlásit jako SPAM
IP: 42.49.180.–
e
~ Anonymní uživatel
140 příspěvků
před 14 hodinami   #26
-
0
-

-1 OR 2+384-384-1=0+0+0+1 --

Nahlásit jako SPAM
IP: 42.49.180.–
e
~ Anonymní uživatel
140 příspěvků
před 14 hodinami   #27
-
0
-

-1 OR 2+960-960-1=0+0+0+1

Nahlásit jako SPAM
IP: 42.49.180.–
e
~ Anonymní uživatel
140 příspěvků
před 14 hodinami   #28
-
0
-

-1' OR 2+387-387-1=0+0+0+1 --

Nahlásit jako SPAM
IP: 42.49.180.–
e
~ Anonymní uživatel
140 příspěvků
před 14 hodinami   #29
-
0
-

-1' OR 2+491-491-1=0+0+0+1 or 'TwLjJkX5'='

Nahlásit jako SPAM
IP: 42.49.180.–
e
~ Anonymní uživatel
140 příspěvků
před 14 hodinami   #30
-
0
-

-1" OR 2+904-904-1=0+0+0+1 --

Nahlásit jako SPAM
IP: 42.49.180.–
e
~ Anonymní uživatel
140 příspěvků
před 14 hodinami   #31
-
0
-

if(now()=sysdate(),sleep(4),0)/*'XOR(if(now()=sysdate(),sleep(4),0))OR'"XOR(if(now()=sysdate(),sleep(4),0))OR"*/

Nahlásit jako SPAM
IP: 42.49.180.–
e
~ Anonymní uživatel
140 příspěvků
před 14 hodinami   #32
-
0
-

(select(0)from(select(sleep(4)))v)/*'+(select(0)from(select(sleep(4)))v)+'"+(select(0)from(select(sleep(4)))v)+"*/

Nahlásit jako SPAM
IP: 42.49.180.–
e
~ Anonymní uživatel
140 příspěvků
před 14 hodinami   #33
-
0
-

1 waitfor delay '0:0:12' --

Nahlásit jako SPAM
IP: 42.49.180.–
e
~ Anonymní uživatel
140 příspěvků
před 14 hodinami   #34
-
0
-

wco8FeCW'; waitfor delay '0:0:4' --

Nahlásit jako SPAM
IP: 42.49.180.–
e
~ Anonymní uživatel
140 příspěvků
před 14 hodinami   #35
-
0
-

t3yDmQqq';select pg_sleep(8); --

Nahlásit jako SPAM
IP: 42.49.180.–
e
~ Anonymní uživatel
140 příspěvků
před 14 hodinami   #36
-
0
-

rW8M6TOD');select pg_sleep(12); --

Nahlásit jako SPAM
IP: 42.49.180.–
e
~ Anonymní uživatel
140 příspěvků
před 14 hodinami   #37
-
0
-

YpSrQl5M'));select pg_sleep(4); --

Nahlásit jako SPAM
IP: 42.49.180.–
e
~ Anonymní uživatel
140 příspěvků
před 14 hodinami   #38
-
0
-

  • -1 OR 2+104-104-1=0+0+0+1 --

Nahlásit jako SPAM
IP: 42.49.180.–
e
~ Anonymní uživatel
140 příspěvků
před 14 hodinami   #39
-
0
-

  • -1 OR 2+295-295-1=0+0+0+1

Nahlásit jako SPAM
IP: 42.49.180.–
e
~ Anonymní uživatel
140 příspěvků
před 14 hodinami   #40
-
0
-

  • -1' OR 2+734-734-1=0+0+0+1 --

Nahlásit jako SPAM
IP: 42.49.180.–
e
~ Anonymní uživatel
140 příspěvků
před 14 hodinami   #41
-
0
-

  • -1' OR 2+733-733-1=0+0+0+1 or '3S6NOPaQ'='

Nahlásit jako SPAM
IP: 42.49.180.–
e
~ Anonymní uživatel
140 příspěvků
před 14 hodinami   #42
-
0
-

  • -1" OR 2+916-916-1=0+0+0+1 --

Nahlásit jako SPAM
IP: 42.49.180.–
e
~ Anonymní uživatel
140 příspěvků
před 14 hodinami   #43
-
0
-

  • if(now()=sysdate(),sleep(4),0)/*'XOR(if(now()=sysdate(),sleep(4),0))OR'"XOR(if(now()=sysdate(),sleep(4),0))OR"*/

Nahlásit jako SPAM
IP: 42.49.180.–
e
~ Anonymní uživatel
140 příspěvků
před 14 hodinami   #44
-
0
-

  • (select(0)from(select(sleep(8)))v)/*'+(select(0)from(select(sleep(8)))v)+'"+(select(0)from(select(sleep(8)))v)+"*/

Nahlásit jako SPAM
IP: 42.49.180.–
e
~ Anonymní uživatel
140 příspěvků
před 14 hodinami   #45
-
0
-

  • 1 waitfor delay '0:0:8' --

Nahlásit jako SPAM
IP: 42.49.180.–
e
~ Anonymní uživatel
140 příspěvků
před 14 hodinami   #46
-
0
-

  • OqDG5Mi3'; waitfor delay '0:0:8' --

Nahlásit jako SPAM
IP: 42.49.180.–
e
~ Anonymní uživatel
140 příspěvků
před 14 hodinami   #47
-
0
-

  • H0UYIp45';select pg_sleep(12); --

Nahlásit jako SPAM
IP: 42.49.180.–
e
~ Anonymní uživatel
140 příspěvků
před 14 hodinami   #48
-
0
-

  • 5jTzxGXo');select pg_sleep(12); --

Nahlásit jako SPAM
IP: 42.49.180.–
e
~ Anonymní uživatel
140 příspěvků
před 14 hodinami   #49
-
0
-

  • fZ8gOgCP'));select pg_sleep(4); --

Nahlásit jako SPAM
IP: 42.49.180.–
Zjistit počet nových příspěvků

Přidej příspěvek

×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, 5 hostů

Podobná vlákna

Pexeso — založil janca.dr

Pexeso — založil Markéta

Pexeso v delphi — založil sepik

Pexeso Boti — založil Kubas129

 

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