一個簡單的javascript腳本變壞了！

Question

我想設置一個簡單的腳本來切換複選框中的鏈接。

我在下面的腳本工作，但它只改變FIRST實例的href。

我敢肯定，這樣做可能更簡單一些，因爲我有很多冗餘代碼。

任何人都可以幫助我瞭解這一點嗎？

謝謝！ 尼克

<script type="text/javascript"> 
function toggleLinks() { 
    //instant attraction 
    if (document.getElementById('add_to_cart').href == "http://bradp.com/dlg/sell.php?prodData=cb%2C1") document.getElementById('add_to_cart').href = "http://bradp.com/dlg/sell.php?prodData=cb%2C15"; 
    else if (document.getElementById('add_to_cart').href == "http://bradp.com/dlg/sell.php?prodData=cb%2C15") document.getElementById('add_to_cart').href = "http://bradp.com/dlg/sell.php?prodData=cb%2C1"; 

    //fashion bible 
    if (document.getElementById('add_to_cart').href == "http://bradp.com/dlg/sell.php?prodData=cb%2C4") document.getElementById('add_to_cart').href = "http://bradp.com/dlg/sell.php?prodData=cb%2C16"; 
    else if (document.getElementById('add_to_cart').href == "http://bradp.com/dlg/sell.php?prodData=cb%2C16") document.getElementById('add_to_cart').href = "http://bradp.com/dlg/sell.php?prodData=cb%2C4";  

    //underground dating seminar 
    if (document.getElementById('add_to_cart').href == "http://bradp.com/dlg/sell.php?prodData=cb%2C5") document.getElementById('add_to_cart').href = "http://bradp.com/dlg/sell.php?prodData=cb%2C17"; 
    else if (document.getElementById('add_to_cart').href == "http://bradp.com/dlg/sell.php?prodData=cb%2C17") document.getElementById('add_to_cart').href = "http://bradp.com/dlg/sell.php?prodData=cb%2C5";  

    //planning the perfect date 
    if (document.getElementById('add_to_cart').href == "http://bradp.com/dlg/sell.php?prodData=cb%2C6") document.getElementById('add_to_cart').href = "http://bradp.com/dlg/sell.php?prodData=cb%2C18"; 
    else if (document.getElementById('add_to_cart').href == "http://bradp.com/dlg/sell.php?prodData=cb%2C18") document.getElementById('add_to_cart').href = "http://bradp.com/dlg/sell.php?prodData=cb%2C6";  

    //how to beat approach anxiety 
    if (document.getElementById('add_to_cart').href == "http://bradp.com/dlg/sell.php?prodData=cb%2C7") document.getElementById('add_to_cart').href = "http://bradp.com/dlg/sell.php?prodData=cb%2C19"; 
    else if (document.getElementById('add_to_cart').href == "http://bradp.com/dlg/sell.php?prodData=cb%2C19") document.getElementById('add_to_cart').href = "http://bradp.com/dlg/sell.php?prodData=cb%2C7";  

    //interviews with naturals 
    if (document.getElementById('add_to_cart').href == "http://bradp.com/dlg/sell.php?prodData=cb%2C8") document.getElementById('add_to_cart').href = "http://bradp.com/dlg/sell.php?prodData=cb%2C20"; 
    else if (document.getElementById('add_to_cart').href == "http://bradp.com/dlg/sell.php?prodData=cb%2C20") document.getElementById('add_to_cart').href = "http://bradp.com/dlg/sell.php?prodData=cb%2C8";  

    //crocodile style 
    if (document.getElementById('add_to_cart').href == "http://bradp.com/dlg/sell.php?prodData=cb%2C9") document.getElementById('add_to_cart').href = "http://bradp.com/dlg/sell.php?prodData=cb%2C21"; 
    else if (document.getElementById('add_to_cart').href == "http://bradp.com/dlg/sell.php?prodData=cb%2C21") document.getElementById('add_to_cart').href = "http://bradp.com/dlg/sell.php?prodData=cb%2C9";  

    //pheromone kids 10 minute seduction 
    if (document.getElementById('add_to_cart').href == "http://bradp.com/dlg/sell.php?prodData=cb%2C10") document.getElementById('add_to_cart').href = "http://bradp.com/dlg/sell.php?prodData=cb%2C22";  
    else if (document.getElementById('add_to_cart').href == "http://bradp.com/dlg/sell.php?prodData=cb%2C22") document.getElementById('add_to_cart').href = "http://bradp.com/dlg/sell.php?prodData=cb%2C10"; 

    //joe natural uncensored 
    if (document.getElementById('add_to_cart').href == "http://bradp.com/dlg/sell.php?prodData=cb%2C11") document.getElementById('add_to_cart').href = "http://bradp.com/dlg/sell.php?prodData=cb%2C23";  
    else if (document.getElementById('add_to_cart').href == "http://bradp.com/dlg/sell.php?prodData=cb%2C23") document.getElementById('add_to_cart').href = "http://bradp.com/dlg/sell.php?prodData=cb%2C11"; 

    //buzzy: master of threesomes 
    if (document.getElementById('add_to_cart').href == "http://bradp.com/dlg/sell.php?prodData=cb%2C12") document.getElementById('add_to_cart').href = "http://bradp.com/dlg/sell.php?prodData=cb%2C24";  
    else if (document.getElementById('add_to_cart').href == "http://bradp.com/dlg/sell.php?prodData=cb%2C24") document.getElementById('add_to_cart').href = "http://bradp.com/dlg/sell.php?prodData=cb%2C12"; 

} 
</script> 

Answer 1

在HTML中，ID屬性是唯一的。在具有相同ID的任何給定頁面上應該只有一個元素。

因此，document.getElementById只希望找到一個元素，所以只返回一個。你需要更復雜的設置來捕捉所有的鏈接，這些鏈接真的應該共享一個類，而不是一個ID。

您正在尋找的那種行爲 - 獲取元素的集合並以這種方式對它們進行操作 - 可以通過類似jQuery的行爲來實現，因爲它會自動遍歷元素。否則，一旦你設法選擇你想要的所有元素，你就會自己做循環。

Answer 2

儘量符合W3C標準，不要使用相同的ID爲一個以上的元素。

如果你真的要做這樣一來，一起來看看getElementsByTagName

Answer 3

您不應該爲多個元素使用相同的ID。改爲使用班級。一旦你這樣做，你可以使用jQuery做這樣的事情：

jQuery(".myClass").each(function() { 
    this.href='...'; 
});