События и изображения.
Всем привет, читал учебник, возник вопрос при нажатии на кнопку, должно меняться изображение:
<body> <div align = "center" > <img id="menu"> </div> </br> <div align = "center" > <input type="button" id="btn1" value="1"> <input type="button" id="btn2" value="2"> <input type="button" id="btn3" value="3"> <input type="button" id="btn4" value="4"> <input type="button" id="btn5" value="5"> <input type="button" id="btn6" value="6"> <input type="button" id="btn7" value="7"> <input type="button" id="btn8" value="8"> <input type="button" id="btn9" value="9"> <input type="button" id="btn0" value="0"> <a><button value="7" id="btn7"><onclick = 'run()'> 7 </button></a> </div> </body>
window.onload = function(){
var img = document.getElementById('menu')
img.src = "1.jpg"
function runimg1(){
var runimg=document.createElement('img')
runimg.src="2.jpg"
document.getElementById('menu').appendChild(runimg)
function runimg2(){
var runimgm=document.createElement('img')
runimgm.src='3.jpg'
document.getElementById('menu').appendChild(runimgm)
}
//пробовал разные варианты, что то ничего не работает :(
var btn7 = document.getElementById("btn7")
var handler= runimg1()
btn7.attachEvent("onclick", handler);
пробовал менять через Id, через функцию которая бы вызывалась при нажатии, не работает. :( и еще такой вопрос, если я хочу смену картинки сделать по нажатию комбинации кнопок? (onclick3&onclick3&onclick4) подскажите в чем может быть проблема. спс. |
Цитата:
<button value="7" id="btn7" onclick= "run()"> 7 </button> Вообщем, вот:
<img alt="" id="MyImg">
<input type="button" value="1" onclick="Img('ссылка на изображение')">
<input type="button" value="2" onclick="Img('ссылка на изображение')">
<input type="button" value="3" onclick="Img('ссылка на изображение')">
<input type="button" value="4" onclick="Img('ссылка на изображение')">
function Img(a)
{
document.getElementById('MyImg').src = a;
}
|
спасибо за ответ.
onclick= "run()" это была функция которая запускала runimg1(), но таким способом у меня ничего не заработало. Я просто хотел разобраться как это сделать через id кнопки, что бы можно было использовать комбинации кнопок. |
f0rzik, через комбинации кнопок...
создайте функцию, которую вызывайте по нажатию на определенные кнопки...ну и скажем запишите, а потом сравнивайте id кнопок по которым кликнули, если в итоге получилась правильная комбинация, то все ок... |
ясно а почему когда я пишу например
document.getElementById('btn7').onclick = function() {
alert('Клик');}
по идее я ж определяю Id кнопки, и если я ее нажал происходит вызов alert, а на деле ничего не происходит. |
<input type="button" value="1" id=btn7>
<script type="text/javascript">
document.getElementById('btn7').onclick = function() {
alert('Клик');}
</script>
|
хммм странно только почему это у меня не работает...
|
<button value="7" id="btn7"><onclick = 'run()'> 7 </button> Вы наверное опять не правильно пишете. |
Цитата:
либо событие определять в window.onload=
<script type="text/javascript">
window.onload= function Img() {
document.getElementById('btn7').onclick = function() {
alert('Клик');}
}
</script>
<input type="button" value="1" id=btn7>
|
то Ruslan_xDD нет в этот раз уже правильно :)
то Deff таки да, скрипт был раньше. спасибо. но теперь всплывает такой вопрос по поводу комбинаций, я же могу так написать:
<script type="text/javascript">
var com1=document.getElementById('btn7').onclick
var com2=document.getElementById('btn8').onclick
if(com1&&com1&&com2) {
alert('778');
}
</script>
|
<script type="text/javascript">
window.onload= function Img() {
var com1=document.getElementById('btn7');
var com2=document.getElementById('btn8');
com1.onclick=com2.onclick = function() {
alert('778');
}
}
</script>
<input type="button" value="1" id=btn7>
<input type="button" value="2" id=btn8>
|
то Deff в таком случае получается что при нажатии на любую кнопку, вызывает событие, так как они равны?
|
f0rzik,
:( Ну нун обиснять чо нужно, - Ваша идея в посте 10 - равноценна 11 |
f0rzik,
<script type="text/javascript">
var i = 0, arr = ["btn7", "btn7", "btn8"];
function Img(but) {
if (but == arr[i]) {
i++;
if (i == arr.length) { return alert("клик"); }
}
else { i = 0; }
}
window.onload = function () {
var com1=document.getElementById('btn7');
var com2=document.getElementById('btn8');
com1.onclick=com2.onclick = function() {
Img(this.id);
}
}
</script>
<input type="button" value="1" id=btn7>
<input type="button" value="2" id=btn8>
|
Ксать удобнее массив селекторов и arraу и цикл присвоения onclick - судя по неоднозначности количества кликабельных
|
то Deff
извините за невнятное изложение проблемы, я при нажатии определенной комбинации кнопок (в качестве примера 778) получить событие, если комбинация не совпадает с 778 ничего не получать. по совету lord2kim написал нечто такое:
var com1=document.getElementById('btn7');
var com2=document.getElementById('btn8');
if(com1.onclick && com1.onclick && com2.onclick) {
alert('778');
}
}
<input type="button" value="1" id=btn7> <input type="button" value="2" id=btn8> по идее ведь должно работать? написал позже чем вы ответили ) |
&& - означает одновременное наличие(нажаты все кнопки одновременно
|| = близко - но подобные вещи не работают в событиях |
f0rzik, так не может работать...в данном случае onclick вернет функцию, установленную на соответствующий элемент
да и как он так посчитает...вы же не при трипл-клике вызываете функцию юзайте #14 пост |
ок всем спасибо за ответы и помощь.
|
извините за нубство, но возник такой вопрос:
<div align = "center" > <img src="img.jpg" id="menu"> </div> вот блок в котором по умолчанию выводится изображение img.jpg. есть такие функции :
function run(){
var dg=document.getElementById('menu')
dg.src="img.jpg"
}
window.onload= function clc7() {
document.getElementById('btn7').onclick = run()
}
и соответственно кнопка: <input type="button" id="btn7" value="7"> вопрос почему изображение меняется сразу, при загрузке страницы, а не по нажатию на кнопку? |
потому что в строчке
document.getElementById('btn7').onclick = run()
запускается функция run Вместо этой строчки напишите
document.getElementById('btn7').onclick = function() {run();}
или
document.getElementById('btn7').onclick = run
|
| Часовой пояс GMT +3, время: 01:26. |