javascript - Javascript onClick double click

Question

I am developing this solution for Google Earth. I have a header that has buttons created with CSS that when clicked trigger the loading of a KML. The problem I have is if the user clicks the button again it loads the same KML again. I need to prevent this from happening. I was considering once clicked it will gray out the button until the Remove KML function is selected or if the user clicks the button again it removes it. I need it to be buttons and not a checkmark.

function createNetworkLink(newlink) {
var networkLink = ge.createNetworkLink("");
var link = ge.createLink("");
link.setHref(newlink);
networkLink.setLink(link);
ge.getFeatures().appendChild(networkLink);

---

function LoadKML() {
var newlink = "http://www.something.com/test.kml";
createNetworkLink(newlink);

---

<div id='topmenu'>
<ul style="width: auto">
<li class='active'><a href="www.something.com"><span>Home</span></a></li>
<li><a title="KML 1" href='#'onClick=LoadKML();><span>KML 1</span></a></li>
<li class='last' style="width: auto"><a href='#'onClick=killKML();><span>Remove KMLs</spam></a></li>

I have the function working to kill the KML without issues.

---

function killKML(source) {
var features = ge.features().getChildNodes();
for (var i=0; i < features.getLength(); i++)
{
var feature = features.item(i);
if (! source) {
ge.getFeatures().removeChild(feature);
}
}
}

Answer 1

There is no jQuery used in the code... so I'm suggesting a simple flag based solution

var kmlLoaded = false;

function LoadKML() {
    if (kmlLoaded) {
        return
    }
    var newlink = "http://www.something.com/test.kml";
    createNetworkLink(newlink);
    kmlLoaded=true;
}

function killKML(source) {
    kmlLoaded=false;
    var features = ge.features().getChildNodes();
    for (var i = 0; i < features.getLength(); i++) {
        var feature = features.item(i);
        if (!source) {
            ge.getFeatures().removeChild(feature);
        }
    }
}