使用document.getElementById時var null而不是對象

我正在做一些HTML和JQuery工作。我有一個問題，我的textarea和提交按鈕不會出現在單選按鈕被選中後。我的HTML看起來像這樣：使用document.getElementById時var null而不是對象

<html> 
<head><title>Publications Database | Which spotlight for Publications</title> 


<script type="text/javascript" src="./jquery.js"></script> 
<script src="./addSpotlight.js" type="text/javascript" charset="utf-8"></script> 


</head> 
<body> 
<div class="wrapper"> 
     <div class="header"> 
    <div class="headerText">Which spotlight for Publications</div> 
</div> 
<div class="mainContent"> 
    <p>Please select the publication that you would like to make the spotlight of this month:</p> 
    <form action="addSpotlight" method="POST" id="form" name="form"> 


      <div class="div29" id="div29"><input type="radio" value="29" name="publicationIDs" >A System For Dynamic Server Allocation in Application Server Clusters, IEEE International Symposium on Parallel and Distributed Processsing with Applications, 2008 </div> 

      <div class="div30" id="div30"><input type="radio" value="30" name="publicationIDs" >Analysing BitTorrent's Seeding Strategies, 7th IEEE/IFIP International Conference on Embedded and Ubiquitous Computing (EUC-09), 2009 </div> 

      <div class="div31" id="div31"><input type="radio" value="31" name="publicationIDs" >The Effect of Server Reallocation Time in Dynamic Resource Allocation, UK Performance Engineering Workshop 2009, 2009 </div> 

      <div class="div32" id="div32"><input type="radio" value="32" name="publicationIDs" >idk, hello, 1992 </div> 

      <div class="div33" id="div33"><input type="radio" value="33" name="publicationIDs" >sad, safg, 1992 </div> 

     <div class="abstractWriteup" id="abstractWriteup"><textarea name="abstract"></textarea> 
      <input type="submit" value="Add Spotlight"></div> 
    </form> 

</div> 
</div> 
</body> 
</html>

我的JavaScript看起來像這樣：

$(document).ready(function() { 
$('.abstractWriteup').hide(); 
addAbstract(); 
}); 

function addAbstract() { 
var abstractWU = document.getElementById('.abstractWriteup');  

$("input[name='publicationIDs']").change(function() {   
    var abstractWU = document.getElementById('.abstractWriteup');  
    var classNameOfSelected = $("input[name='publicationIDs']").val(); 

    var radioSelected = document.getElementById("div"+classNameOfSelected);  
    var parentDiv = radioSelected.parentNode; 

    parentDiv.insertBefore(radioSelected, abstractWU.nextSibling);  
    $('.abstractWriteup').show(); 

});};

我以Node#insertBefore開發了這個。當我有它的工作，它已經重新排列單選按鈕。
由於提前
院長

來源

2010-04-11 Dean

我已經它與jQuery重寫爲較短的版本：

function addAbstract() { 
    $("input[name='publicationIDs']").change(function() { 
    var abstractWU = document.getElementById('abstractWriteup'); 
    var selected = $("input[name='publicationIDs']:checked").val(); 
    var radioSelected = document.getElementById("div"+selected); 

    $("#abstractWriteup").insertAfter(radioSelected); 

    $(abstractWU).show(); 

    }); 
};

來源

2010-04-25 17:48:39 Dean

看來，你有你的getElementById參數.。

getElementById不處理類。

您應該不是有id s與共享名稱相同的類。反之亦然。

id的意思是唯一。

這應該有效，但我懇請您重新考慮您的命名方案。

function addAbstract() { 
$("input[name='publicationIDs']").change(function() {   
    var abstractWU = document.getElementById('abstractWriteup');  

    var radioSelected = document.getElementById("div"+ $(this).attr('id'));  
    var parentDiv = radioSelected.parentNode; 

    parentDiv.insertBefore(radioSelected, abstractWU.nextSibling);  
    $(abstractWU).show(); 

});};

來源

2010-04-11 22:26:47

確定這固定的問題然而單選按鈕的列表得到混洗和abstractWU對象作爲單選按鈕移動向上移動在列表中。 – Dean 2010-04-11 22:31:38

更新了我的答案。 – 2010-04-11 22:34:00

試過了，仍然有和以前一樣的問題。我現在也擺脫了單選按鈕和abstractWriteUp的所有div類名，所以現在只有ID可以玩。 – Dean 2010-04-11 22:41:24

使用document.getElementById時var null而不是對象

回答

相關問題