2012-07-10 146 views
2

嗨。我有以下代碼可以在這裏看到:http://designliving.tk/test.html當你點擊「查看360」<div>和文本的變化,你可以看到。必須在jQuery上點擊兩次

當你點擊「這是一個圖像」時,它應該將它重置爲「View 360」。

現在唯一的問題是,當你點擊「這是一個圖像」,你必須點擊兩次「查看360」才能讓DIV再次改變。

它應該改變第一次點擊。我嘗試重新安排我的代碼沒有成功。

<!DOCTYPE html> 
<html> 
    <head> 
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script> 
<script> 
    $(document).ready(function(){ 
    $('#toggleDiv').toggle(function() { 
     $('#imgThree').show(); 
     $('#imgNorm').hide(); 
     $(this).html('<a href="#">View Normal</a>'); 
    }, function() { 
     $('#imgThree').hide(); 
     $('#imgNorm').show(); 
     $(this).html('<a href="#">View 360</a>'); 
    }); 
    $('#changeDiv').click(function() { 
     $('#imgThree').hide(); 
     $('#imgNorm').show(); 
     $('#toggleDiv').html('<a href="#">View 360</a>'); 
    }); 
    }); 
</script> 

<style type="text/css"> 
    #imgThree { 
    display: none; 
    } 
</style> 
    </head> 
    <body> 
<div id="toggleDiv"><a href="#">View 360</a></div> 
<br> 
<br> 
<div id="imgNorm">Normal Product Image Here</div> 
<div id="imgThree">360 Spin Image Here</div> 
<br> 
<br> 
<div id="changeDiv"> 
<a href="#">This is an image</a><br> 
<a href="#">This is an image</a><br> 
<a href="#">This is an image</a> 
</div> 
    </body> 
</html> 

謝謝大家的幫助。

+2

這是因爲你使用'切換()的'... – 2012-07-10 21:37:49

+0

你能不能提供一些線索,我怎麼需要調整的代碼? – BirdQuestions 2012-07-10 21:49:29

回答

1
$(document).ready(function(){ 
    hide = function(){ 
     $('#imgThree').hide(); 
     $('#imgNorm').show(); 
     $('#toggleDiv').html('<a href="#">View 360</a>'); 
    } 
    $('#toggleDiv').toggle(function() { 
     $('#imgThree').show(); 
     $('#imgNorm').hide(); 
     $(this).html('<a href="#">View Normal</a>'); 
    }, hide); 
    $('#changeDiv').click(function(){ 
     if($('#imgThree:hidden').length > 0){ 
      $('#toggleDiv').trigger('click'); 
     } 
    }); 
    });​ 

http://jsfiddle.net/HV39C/

+0

另外一個很好的解釋:[here](http://stackoverflow.com/a/244468/1422309) – Stano 2012-07-10 22:05:14

相關問題