Форум

Skriptor · #1 (**permalink**) 22.12.2014, 22:41

Как исправить здесь код, чтобы по клику на одну из видимых рекламных ссылок (ссылка1 или ссылка2) - появлялась невидимая ссылка3 (желательно исправив данный код, а не заменив его на другой):

<html>
<head>
<title>HTML Main page</title>
<meta http-equiv="Content-Type" content="text/html; charset=window-1251">
<script type='text/javascript'>
function trans(G10) {
document.getElementById("site55").innerHTML = "";
}

function trans(G20) {
document.getElementById("site56").innerHTML = "";
}
</script>
</head>
<body>
<a href="http://ссылка1" target="_blank" id="site55" onclick="trans(G10);">SAPE</a>
<br>
<a href="http://ссылка2" target="_blank" id="site56" onclick="trans(G20);">MIRALINKS</a>
<br>
<a href="http://ссылка3" style="visibility:hidden" target="_blank" id="site57">GO!</a>
</body>
</html>

krutoy · #2 (**permalink**) 22.12.2014, 23:24

<html>
<head>
<title>HTML Main page</title>
<meta http-equiv="Content-Type" content="text/html; charset=window-1251">
</head>
<body>
<a href="http://ссылка1" target="_blank" id="site55" onclick="return trans(this);">SAPE</a>
<br>
<a href="http://ссылка2" target="_blank" id="site56" onclick="return trans(this);">MIRALINKS</a>
<br>
<a href="http://ссылка3" style="display: none" target="_blank" id="site57">GO!</a>
<script type='text/javascript'>
h=document.querySelector("#site57")
show=function(){h.style.display="block"}
function trans(ths) {
ths.innerHTML=""
show()
return false
}
</script>

</body>
</html>

Skriptor · #3 (**permalink**) 23.12.2014, 13:24

Ага спасибо. А как сделать чтобы обе исчезали, а третья появилась?

krutoy · #4 (**permalink**) 23.12.2014, 16:16

Сообщение от Skriptor

А как сделать чтобы обе исчезали, а третья появилась?

<html>
<head>
<title>HTML Main page</title>
<meta http-equiv="Content-Type" content="text/html; charset=window-1251">
</head>
<body>
<a href="http://ссылка1" target="_blank" id="site55" onclick="return trans(this);">SAPE</a>
<br>
<a href="http://ссылка2" target="_blank" id="site56" onclick="return trans(this);">MIRALINKS</a>
<br>
<a href="http://ссылка3" style="display: none" target="_blank" id="site57">GO!</a>
<script type='text/javascript'>
h=document.querySelector("#site57")
v1=document.querySelector("#site55")
v2=document.querySelector("#site56")
show=function(){h.style.display="block"}
function trans(ths) {
v1.innerHTML=v2.innerHTML=""
show()
return false
}
</script>
 
</body>
</html>

Skriptor · #5 (**permalink**) 25.12.2014, 15:22

Немного сложно понять логику здесь, хотя срабатывает.
Если можно, объясните пожалуйста, что означает здесь:
v1.innerHTML=v2.innerHTML=""
Также не понял значения querySelector
Пока что изучаю чистый javascript, хотелось бы упростить код (пусть даже больше места займет), но чтобы понять логику.

Malleys · #6 (**permalink**) 25.12.2014, 15:29

Сообщение от Skriptor

v1.innerHTML=v2.innerHTML=""

Означает, как v1.innerHTML, так и v2.innerHTML присвоить "";

Malleys · #7 (**permalink**) 25.12.2014, 15:34

Сообщение от Skriptor

не понял значения querySelector.

Метод querySelector() возвращает первый элемент, соответствующий заданному CSS-селектору

Skriptor · #8 (**permalink**) 25.12.2014, 18:07

Постарался учесть предыдущие разъяснения, подготовил такой вариант, но почему то не срабатывает... Почему?

<html>
<head>
<title>HTML Main page</title>
<meta http-equiv="Content-Type" content="text/html; charset=window-1251">
<script type='text/javascript'>
function trans(el1,el2) {
el1=document.getElementById("site55");
el2=document.getElementById("site56");
e1.innerHTML=el2.innerHTML="";
document.getElementById("site57").style.visibility = "visible";
}
</script>
</head>
<body>
<a href="http://ссылка1" target="_blank" id="site55" onclick="trans(this);">SAPE</a>
<br>
<a href="http://ссылка2" target="_blank" id="site56" onclick="trans(this);">MIRALINKS</a>
<br>
<a href="http://ссылка3" style="visibility:hidden" target="_blank" id="site57">GO!</a>
</body>
</html>

Malleys · #9 (**permalink**) 25.12.2014, 18:19

Кликаешь по одной из ссылок, обе скрываются, 3-яя проявляется

<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
	<title>HTML Main page</title>
    <script>
	
function $(element) {
  return document.getElementById(element);
}
	
function trans() {
  $("site55").style.visibility = 'hidden';
  $("site56").style.visibility = 'hidden';;
  $("site57").style.visibility = 'visible';
}

    </script>
  </head>
  <body>
    <a href="http://ссылка1" target="_blank" id="site55" onclick="trans(); return false; ">SAPE</a><br />
	<a href="http://ссылка2" target="_blank" id="site56" onclick="trans(); return false; ">MIRALINKS</a><br />
	<a href="http://ссылка3" style="visibility: hidden; " target="_blank" id="site57"onclick="return false; ">GO!</a>
  </body>
</html>

Skriptor · #10 (**permalink**) 25.12.2014, 22:53

Почему у меня не сработало? Что в приведенном мною коде не так? Интересуюсь для изучения... чтобы в следующий раз учесть.

Форум

Справочник

Discord чат

Курсы javascript