2017-04-01 61 views
1

我是JavaScript的新手,我似乎無法弄清楚爲什麼會發生這種情況。使用複選框我試圖在點擊時將複選框的值添加到數組中。它似乎增加了罰款,但兩次。值被添加到陣列兩次,我不明白爲什麼

這裏的HTML:

<form id= "checkboxes"> 
<label> Types of Places</label> 
<link rel="stylesheet" type="text/css" href="css/style.css"> 
    <input type="checkbox" name="cbox" value="woodland" class="places"/> 
    <label for="woodland"><img src="../img/Woodland.jpg" /></label> 
    <input type="checkbox" name="cbox" value="lodging" class="places"/> 
    <label for="viewpoint"><img src="../img/Viewpoint.jpg" /></label> 
    <input type="checkbox" name="cbox" value="restaurant" class="places"/> 
    <label for="restaurant"><img src="../img/Restaurant.jpg" /></label> 
    <input type="checkbox" name="cbox" value="museum" class="places" /> 
    <label for="historical"><img src="../img/Historical.jpg" /></label> 
    </form> 

和這裏的相關JS/JQuery的:

var placeT = []; 

function initialize() { 
    // Default the map view to UK 
    var mapOptions = { 
     center: new google.maps.LatLng(55.3781, -3.4360), 
     mapTypeId: google.maps.MapTypeId.ROADMAP, 
     zoom: 5 
    }; 

    new AutocompleteDirectionsHandler(map); 

    $(".places").change(function() { 
     $(".places").each(function() { 
      if ($(this).is(':checked')) { 
       placeT.push($(this).val()); 
      } 
     }); 
     alert(placeT); 
    }); 

} 

function findPlaces(boxes, searchIndex) { 



    var request = { 
     bounds: boxes[searchIndex], 
     types: [placeT] 
    }; 

    // alert(request.bounds); 
    service.radarSearch(request, function(results, status) { 
     if (status != google.maps.places.PlacesServiceStatus.OK) { 
      alert("Request[" + searchIndex + "] failed: " + status); 

     } 
     // alert(results.length); 
     document.getElementById('side_bar').innerHTML += "bounds[" + searchIndex + "] returns " + results.length + " results<br>" 
     for (var i = 0, result; result = results[i]; i++) { 
      var marker = createMarker(result); 
     } 
     searchIndex++; 
     if (searchIndex < boxes.length) 
      findPlaces(boxes, searchIndex); 
    }); 
} 

我知道這可能是一些簡單,但我似乎無法推測出來。謝謝你的幫助!

+0

你永遠不空'placeT'陣列? – adeneo

+0

它從複選框的一次點擊中添加2個實例,將清空數組解決這個問題? –

+0

然後最有可能'初始化'運行兩次 – adeneo

回答

1

更改您的代碼如下:

$(".places").change(function() 
    { 
     placeT = []; 
     $(".places").each(function() 
     { 
      if($(this).is(':checked')) 
      { 
       placeT.push($(this).val()); 
      } 
     }); 
     alert(placeT); 
    }); 
+0

這樣做的竅門,非常感謝! –

+0

您是否願意接受答案並且讚賞它? –

+0

一旦計時器用完,我就會接受答案,還剩5分鐘。 –

相關問題