Var null, а не объект при использовании document.getElementById - PullRequest
Новая
       11

Var null, а не объект при использовании document.getElementById

1 голос
/ 12 апреля 2010

Я делаю некоторую работу в HTML и JQuery. У меня проблема с моей текстовой областью, и кнопка подтверждения не появляется после выбора переключателя. Мой HTML выглядит так: 

<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 . Когда он работал, он переставлял радио кнопки.
Заранее спасибо
Декан

Ответы [ 2 ]

5 голосов
/ 12 апреля 2010

Похоже, что у вас есть . в параметре getElementById.

getElementById не обрабатывает классы.

Вы должны , а не иметь id с тем же именем, что и у класса. И наоборот.

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();

 });};
0 голосов
/ 25 апреля 2010

Я переписал его в более короткую версию с 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();

  });
};
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.

Нет похожих вопросов

...