Форум

Deff · #11 (**permalink**) 17.06.2012, 17:45

GrizzlyBear,
А чем плох - onclick для приведенной задачи ?

Собственно нун плясать от отличий фокуса и клика: - фокус вставляет каретку курсора в элемент

GrizzlyBear · #12 (**permalink**) 17.06.2012, 17:50

Я просто как пример привел
Понятно что решений этой задачи много и без фокуса
но я то хочу конкретно с фокусом увидить

Deff · #13 (**permalink**) 17.06.2012, 17:54

<script type="text/javascript" src="http://yandex.st/jquery/1.4.4/jquery.min.js"></script>

<div id=a style="border:blue 1px solid;">также с дивом к примеру в нем текст. при нажатии на див текст пропадает</div>
<br/>
<div id=b style="border:red 1px solid;"> а если нажать в другое место то текст возвращается.</div>


<script type="text/javascript">
$("#a,#b").click(function(){
  if($(this).attr('id')=='a'){$("#a").hide();
  } else $("#a").show();
});
</script>

<script type="text/javascript" src="http://yandex.st/jquery/1.4.4/jquery.min.js"></script>

<div id=a style="border:blue 1px solid;height:23px;">также с дивом к примеру в нем текст. при нажатии на див текст пропадает</div>
<br/>
<div id=b style="border:red 1px solid;height:23px;"> а если нажать в другое место то текст возвращается.</div>


<script type="text/javascript">
$("#a,#b").click(function(){
  if($(this).attr('id')=='a'){ $("#a").attr("alt", $("#a").text() ); $("#a").text('')
  } else $("#a").text( $("#a").attr("alt") );
});
</script>

Octane · #14 (**permalink**) 17.06.2012, 18:08

Лень читать все, просто напишу: в HTML5 <a> относится к flow content, поэтому можно спокойно завернуть блок в ссылку.

Джэксон · #15 (**permalink**) 17.06.2012, 21:59

onfocus тот же самый onclick! И работать на див они будут одинаково!!!

Dim@ · #16 (**permalink**) 17.06.2012, 23:22

Все можно

<html>
<head>
<meta charset='utf-8'>
<title></title>
</head>
<style>
</style>
<body>
<div style='width:100%;height:100%' id='div2' onclick='O(-2,"l")'></div>
<div id='div' style='position:absolute;top:0px;left:0px;width:300px;height:200px;background-color:f00;' onclick='O(2)' onmouseout='O(-1,false)' onmouseover='O(1,true)'>
<b id='b'>Блаблаблаблаблабла текст</b>
</div>
<script type='text/javascript'>
document.k = 0;
document.t = false;
document.l;
var div = document.getElementById('div');
var b = document.getElementById('b');
document.inka = b.innerHTML;
function O(arg,arg2){ 
 if(arg2 == 'l'){
  if(document.k != 2){
   document.k += 2;
  }
 } 
 document.k += arg;
 if(document.k > 3) document.k = 3;
 if(document.k < -3) document.k = -3;
 if((arg2 != null) && (arg2 != undefined)) document.t = arg2;
 if(document.t == true){div.setAttribute('onmouseout','O(-1,false)');div.setAttribute('onmouseover','')}
 else{div.setAttribute('onmouseover','O(1,true)');div.setAttribute('onmouseout','')}
 if(document.k > 0){
  document.getElementById('b').style.opacity = 0;
  document.getElementById('div').style.border = 'solid blue 3px';
 }
 else{
  document.getElementById('b').style.opacity = 1;
  document.getElementById('div').style.border = 'solid red 3px';
 }
}
</script>
</body>
</html>

нажатие на див будто вызывает фокус и он остается (как у формы), ну и при наводке тоже фокус образуется и исчезает при отводе =)=)

P.S. в коде ошибка скоро найду её.
P.P.S ошибка исправлена.

Deff · #17 (**permalink**) 18.06.2012, 03:09

<style>
#a,#b{
 margin:3px 0;
 padding: 2px 12px;
 width:530px;
 float:left;
}
</style>
<span>
<div id=a style="border:blue 1px solid;" onclick="this.style.color='transparent'" >Кликаем - Текст исчезнет</div>
<br/>
<div id=b style="border:red 1px solid;" onclick="this.parentNode.childNodes[1].style.color=''"> Кликаем тут, в Первом окне - появится</div>
</span>

Dim@ · #18 (**permalink**) 18.06.2012, 08:41

все я ошибку исправил в своем примере

Deff · #19 (**permalink**) 18.06.2012, 12:56

Dim@,
Можно существенно сократить

скрытие через onmouseout легко реализовать через css

Dim@ · #20 (**permalink**) 18.06.2012, 12:59

Deff,
да пофиг не так уж много и памяти жрет мой пример

, зато у меня как с реальным фокусом

Форум

Справочник

Discord чат

Курсы javascript