2013-07-22 3 views
0

У меня есть следующий код, и я с помощью переключателя случай, чтобы переключить ГКЗ картинок с помощью кнопки .. я не знаю, почему первый случай в «тревога» не functoning ..javascript-переключатель не работает должным образом?

<div id="main_img"> 
    <center> 
    <button style="width:100;height:100" onClick="LastPic();"><---</button> 
    <img id="img" src="13.jpg" height=70% width=70%> 
    <button style="width:100;height:100" onClick="FirstPic();">---></button> 
</div> 

<script> 
    var james = document.getElementById("img").getAttribute('src'); 
    document.write(james); 

    function FirstPic(){ 
     switch (james){ 
     case "12.jpg": 
      document.getElementById("img").src = "13.jpg"; 
     break; 
     case "13.jpg": 
      document.getElementById("img").src = "14.jpg"; 
     break; 
     case "larry": 
      alert('Hey'); 
     break; 
     default: 
      alert('Default case'); 
     break; 
    } 
    } 
</script> 
+4

'src' вернет вам полный путь' http: //.../ 12.jpg', вместо этого используйте 'getAttribute'. – mohkhan

+0

ах, ты прав, друг ... я должен указать, какой атрибут получить? – Shawn

+0

yeh..the 'src' one ... – mohkhan

ответ

0

Ваша проблема в том, что переменная james одинакова при каждом вызове вашей функции, ее необходимо обновить.

<div id="main_img"> 
<center> 
<button style="width:100;height:100" onclick="LastPic();"><---</button> 
<img id="img" src="13.jpg" height=70% width=70%> 
<button style="width:100;height:100" onclick="FirstPic();">---></button> 
<div id="imagesrc">13.jpg</div> 
</div> 
<script> 
function FirstPic(){ 

var james = document.getElementById("img").getAttribute('src'); 
var imagesrc=document.getElementById('imagesrc'); 
switch (james) 
{ 
    case "12.jpg": 
james = "13.jpg"; 
break; 

    case "13.jpg": 
james = "14.jpg"; 
break; 

    case "larry": 
     alert('Hey'); 
     break; 

    default: 
     alert('Default case'); 
     break; 
} 
imagesrc.innerHTML=james; 
document.getElementById('img').src=james; 
} 
</script> 

JsFiddle

0

добавить тип кнопки тип = "кнопка"

<button type="button" style="width:100;height:100" onClick="FirstPic();">---></button> 

атрибут добавить типа "кнопка" = в кнопке так странице не обратной передачи

+0

только добавить type = "button" в кнопке, чтобы ваша страница не обновлялась ... –

0

Постарайтесь, чтобы это работало.

<script src="http://code.jquery.com/jquery-1.10.1.min.js"></script> 
<script> 
function myFunction() 
{ 
var src = $('img[alt="example"]').attr('src'); 
alert("source of image with alternate text = example - " + src); 

switch (src) 
{ 
    case "12.jpg": 
document.getElementById("img").src = "13.jpg"; 
break; 

    case "13.jpg": 
    alert('sa'); 
    document.getElementById("img").src = "14.jpg"; 
break; 

    case "larry": 
     alert('Hey'); 
     break; 

    default: 
     alert('Default case'); 
     break; 
} 
} 
</script> 
<div id="main_img"> 

<button style="width:100;height:100" onClick="LastPic();"><--- </button> 
<img alt="example" id="img" class="imagess" src="13.jpg" height=70% width=70%> 
<button style="width:100;height:100" onClick="myFunction();">---></button> 
</div> 
Смежные вопросы