onclick и условие else if
Добрый день. Помогите связать onclick и else if. Скрипт рабочий, но сильно не ругайте. При клике на картинку нужно вывести число в переменную "xmodel". Вешать на каждый onclick свой обработчик громоздко и глупо. Хочется поместить все в один обработчик, который работал с условием else if, но не знаю как. :)
<script language="JavaScript">
function calc()
{
var model1 =10;
xmodel.innerHTML = model1;
};
function calc2()
{
var model2 =20;
xmodel.innerHTML = model2;
};
function calc3()
{
var model3 =30;
xmodel.innerHTML = model3;
};
</script>
<body>
<img src="simple1.jpg" onclick="calc();" id="image1" border="2"/>
<img src="simple2.jpg" onclick="calc2();" id="image2" border="2"/>
<img src="simple3.jpg" onclick="calc3();" id="image3" border="2"/>
<td> Значение:<span id="xmodel">0</span> руб.</td>
</body>
|
|
Navilsor,
<!DOCTYPE HTML>
<html>
<head>
<title>Untitled</title>
<meta charset="utf-8">
<script>
document.onclick = function (a) {
var a = a || window.event,
a = a.target || a.srcElement,
b = a.parentNode;
if (a.nodeName.toLowerCase() == "img") {
for (var c = 0, a = a.previousSibling; a && a != b;)
a.nodeName.toLowerCase() == "img" && c++, a = a.previousSibling;
xmodel.innerHTML = [10, 20, 30][c]
}
};
</script>
</head>
<body>
<img src="simple1.jpg" id="image1" border="2"/>
<img src="simple2.jpg" id="image2" border="2"/>
<img src="simple3.jpg" id="image3" border="2"/>
<td> Значение:<span id="xmodel">0</span> руб.</td>
</body>
</html>
|
Цитата:
<!DOCTYPE html>
<html ng-app>
<head>
<script src='http://code.jquery.com/jquery-latest.js'></script>
<!--
<script src="http://code.angularjs.org/1.1.4/angular.min.js"></script>
<link rel='stylesheet type=text/css href=tmp.css' />
-->
<style type='text/css'>
</style>
<script type='text/javascript'>
$(function (){
$('.image').click(function (){
$('#xmodel').text($(this).data('value'));
});
});
</script>
</head>
<body>
<img src="simple1.jpg" id="image1" class='image' data-value='10' border="2"/>
<img src="simple2.jpg" id="image2" class='image' data-value='20' border="2"/>
<img src="simple3.jpg" id="image3" class='image' data-value='30' border="2"/>
<p>Значение:<span id="xmodel">0</span> руб.</p>
</body>
</html>
|
рони, благодарствую за помощь.
Но что если на странице есть еще img, которые должны обрабатываться таким же обработчиком все зависимости от первого? Тогда второй обработчик будет менять img первого. Как избежать? Как разграничить их действия не зависимо друг от друга? |
Извиняюсь, разобрался сам :)
Меняем обработчик страницы document.onclick = function (a) на обработчик function calc(), пишем onclick="calc();" в картинке и готово. |
Navilsor,
не понял ни вопроса ни решения - но раз разобрался тоды ок! |
:)
|
Хочу что-бы в условии if , выполнялось другое условие if, например изменялось толщина border вокруг элемента. Переменную беру из первого условия, в блоке присваиваю border="0". Что не так?
<!DOCTYPE HTML>
<html>
<head>
<title>Untitled</title>
<meta charset="utf-8">
<script>
document.onclick = function (a) {
var a = a || window.event,
a = a.target || a.srcElement,
b = a.parentNode;
if (a.nodeName.toLowerCase() == "img") {
for (var c = 0, a = a.previousSibling; a && a != b;)
a.nodeName.toLowerCase() == "img" && c++, a = a.previousSibling;
xmodel.innerHTML = [10, 20, 30][c]
var border0 = xmodel.innerHTML;
if (border0 = 10)
{
<img src="simple1.jpg" id="image1" border="2"/>
<img src="simple2.jpg" id="image1" border="0"/>
<img src="simple3.jpg" id="image1" border="0"/>
}
else
if (border0 = 20)
{
<img src="simple1.jpg" id="image1" border="0"/>
<img src="simple2.jpg" id="image1" border="2"/>
<img src="simple3.jpg" id="image1" border="0"/>
}
else
{
<img src="simple2.jpg" id="image1" border="0"/>
<img src="simple2.jpg" id="image1" border="0"/>
<img src="simple3.jpg" id="image1" border="2"/>
};
};
}
};
</script>
</head>
<body>
<img src="simple1.jpg" id="image1" border="0"/>
<img src="simple2.jpg" id="image2" border="0"/>
<img src="simple3.jpg" id="image3" border="0"/>
<td> Значение:<span id="xmodel">0</span> руб.</td>
</body>
</html>
|
Цитата:
|
| Часовой пояс GMT +3, время: 01:46. |