[JavaScript][jQuery] Opcje

[KID479]

Witam wszystkich,

Jestem tu nowy, a to jest mój pierwszy post. Zapoznałem się z przypiętymi tematami wiec mam nadzieje że nie popełniam tu żadnego błędu.
A teraz do rzeczy.
Mam na stronie cztery elementy typu class zamknięte w divie:

CODE

<div id="Przyciski">

<p class="Przycisk">Sporty Wodne</p>
<p class="Przycisk">Szkolenia</p>
<p class="Przycisk">Galeria</p>
<p class="Przycisk">Kontakt</p>

</div>

Po wciśnięciu na jeden z nich otwiera mi się okno z parametrami, które zdefiniowałem w CSS:

CODE

.WindowShow{
visibility: visible;
height: 400px;
width: 800px;
margin-left: 100px;
margin-top: 80px;
background-color: #fff;
position: absolute;
border: 8px groove;
opacity: 0.6;
}

Przyciski działają w oparciu o kod java script:

CODE

<script type="text/javascript">
$(document).ready(function(){

$("#Przyciski p").click(function(){
$(this).toggleClass("Click");
$("#Window").toggleClass("WindowShow");
});
});

</script>

(Klasa Click zmienia jedynie kolor tła użytego przycisku na biały).
Kod, który wstawiłem powyżej działa dotąd tak jak tego sobie życzyłem i chciałbym go teraz rozwinąć.
Jak zablokować możliwość wciśnięcia innego przycisku niż ten, którego użyliśmy kiedy okno jest otwarte?

[b4rt3kk]

Możesz sprawdzić czy element #Window jest widoczny, względnie czy posiada klasę WindowShow, jeśli tak to po prostu przerywasz dalsze wykonywanie poleceń w funkcji. Przykład:

[HTML] pobierz, plaintext 
$(document).ready(function(){
 
$("#Przyciski p").click(function(){
if ('#Window').is(":visible")) {
  return;
}
 
$(this).toggleClass("Click");
$("#Window").toggleClass("WindowShow");
});
});
[HTML] pobierz, plaintext 

Ten post edytował b4rt3kk 12.02.2015, 16:51:32

[KID479]

W takiej postaci:

CODE

<script type="text/javascript">
$(document).ready(function(){

$("#Przyciski p").click(function(){
if ('#Window').is(":visible")) {
return;
}

$(this).toggleClass("Click");
$("#Window").toggleClass("WindowShow");
});
});
</script>

Okno w ogóle się nie otwiera. Zarówno przy opcji :visible jak i WindowShow.

[b4rt3kk]

W takiej postaci:

CODE

<script type="text/javascript">
$(document).ready(function(){

$("#Przyciski p").click(function(){
if ('#Window').is(":visible")) {
return;
}

$(this).toggleClass("Click");
$("#Window").toggleClass("WindowShow");
});
});
</script>

Okno w ogóle się nie otwiera. Zarówno przy opcji :visible jak i WindowShow.

Bo skopiowałeś żywcem kod, a tak się składa, że błąd walnąłem i nawiasu brakuje w warunku, popraw u siebie. Powinieneś mieć jakieś narzędzie do debugowania, np. Firebuga.

[KID479]

CODE

<script type="text/javascript">
$(document).ready(function(){

$("#Przyciski p").click(function(){
if (('#Window').is(":visible")) {
return;
}

$(this).toggleClass("Click");
$("#Window").toggleClass("WindowShow");
});
});
</script>

Tak powinno być?

[b4rt3kk]

Coś w tym stylu. Ale to sam już powinieneś wiedzieć, o ile sprawdziłeś czy działa.

Powinno być jeszcze porównanie !== false

Tak jak mówiłem, to tylko przykład.

Ten post edytował b4rt3kk 12.02.2015, 21:42:12

[KID479]

Napisałem w "Przedszkole" bo taki jest mój poziom programowania. Moja wiedza ogranicza się do html i css. Domyślam że ciężko jest doradzać tak zielonym jak ja w tym temacie ale właśnie ze względu na poziom jaki reprezentuje się tu zgłosiłem. Mógłbyś mi jeszcze raz przedstawić jak to powinno wyglądać? Najlepiej ze słowem wyjaśnienia (IMG:style_emoticons/default/wink.gif) W tej chwili mam taki oto błąd, który pojawia się w linijce ,w której znajduje się if:

Uncaught TypeError: undefined is not a function

Koncepcja uległa zmianie. Temat można usunąć

Ten post edytował KID479 12.02.2015, 22:07:11