與onclick事件的錨只工作一次

我試圖從攝氏溫度改變爲farenheit和viceversa，但是當我嘗試它只有一次工作，從攝氏溫度變化到farenheit，並保持在那裏。這是我的頁面：http://codepen.io/Juan1417/pen/zKZkxy。與onclick事件的錨只工作一次

，代碼：

$(document).ready(function(){ 

var temp; 
var long; 
var lat; 

if(navigator.geolocation){ 

    navigator.geolocation.getCurrentPosition(function(position){ 

    lat=position.coords.latitude; 
    long=position.coords.longitude; 

    var api="http://api.openweathermap.org/data/2.5/weather?lat="+lat+"&lon="+long+"&appid=c873adc18574701f4fb0abe01d927819"; 


    $.getJSON(api,function(data){ 

     var city =data.name; 
     var country=data.sys.country; 
     var weather=data.weather[0].main; 
     temp=data.main.temp; 

     addIcon(weather); 

     document.getElementById('location').innerHTML =city+", "+country; 
     document.getElementById('temperature').innerHTML =(temp-273.13)+"<a id='anc' href='#'> Cº</a>"; 

     $("#anc").click(function(e){ 

      if(document.getElementById('anc').innerHTML==" Cº") document.getElementById('temperature').innerHTML =(temp*1.8+32)+"<a id='anc' href='#'> Fº</a>"; 

      else document.getElementById('temperature').innerHTML =(temp-32/1.8)+"<a id='anc' href='#'> Fº</a>"; 

      }); 
     }); 
    }); 


} 

     function addIcon(weather) { 

      switch(weather){ 

      case 'Dizzle': 

       document.getElementById('animation').innerHTML ="<div class='icon sun-shower'><div class='cloud'></div><div class='sun'><div class='rays'></div></div><div class='rain'></div></div>"; 
        break; 

       case 'Rain': 
        document.getElementById('animation').innerHTML ="<div class='icon rainy'><div class='cloud'></div><div class='rain'></div></div>"; 
        break; 
       case 'Snow': 
        document.getElementById('animation').innerHTML ="<div class='icon flurries'><div class='cloud'></div><div class='snow'><div class='flake'></div><div class='flake'></div></div>>/div>"; 
        break; 
       case 'Clear': 
        document.getElementById('animation').innerHTML ="<div class='icon sunny'><div class='sun'><div class='rays'></div></div></div>"; 
        break; 
       case 'Thunderstom': 
        document.getElementById('animation').innerHTML ="<div class='icon thunder-storm'><div class='cloud'></div><div class='lightning'><div class='bolt'></div><div class='bolt'></div></div></div>"; 
        break; 
       default: 

     } 

     } 
});

來源

2016-11-03 Juan

你重新創建<a>該事件聯繫在一起的。您需要在每次點擊時不覆蓋元素，或者不要單擊元素，在文檔上傾聽它，看看是否碰巧在該元素上。

與

$(document).on("click", "#anc", function(){

請參閱更換

$("#anc").click(function(e){

：jQuery's .on()

而且，你的if/else雙雙呈現Fereheit。

Here is the corrected fiddle

來源

2016-11-03 23:46:13

與onclick事件的錨只工作一次

回答

相關問題