javascript开关盒不能正常工作？

我有下面的代码，我使用开关的情况下切换图片的src与按钮..我不知道为什么第一种情况下的“警报”没有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>

来源

2013-07-22 Shawn

'src'会返回完整路径'http：//.../ 12.jpg'，请使用'getAttribute'来代替。 – mohkhan

啊，你是对的，朋友...我必须指定要获得的属性吗？ – Shawn

yeh .. src' one ... – mohkhan

你的问题是，每次你调用你的函数时，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

来源

2013-07-22 04:23:06

附加类型的按钮类型= “按钮”

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

附加属性类型=在按钮的 “按钮”所以页面不回发

来源

2013-07-22 04:40:13

只在按钮中添加type =“button”，以便您的页面不会刷新... –

试试这个工作正常。

<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>

来源

2013-07-22 04:46:04

javascript开关盒不能正常工作？

回答

相关问题