if語句中的值

我需要輸出來自輸入語句的信息。當我得到一個作者 - 它的作品。當我添加作者時，它給了我兩個姓氏，所以它很好。我添加第三個作者，它給了我第一個作者的姓，然後第三個作者姓兩次 - 它應該給我第一個作者，第二個作者，然後是第三個作者的姓。所以問題是 - 當我有三位作者時，它應該給我所有作者的姓氏，而不是第一個，然後是第三個。if語句中的值

<!DOCTYPE HTML> 
<html lang='pl'> 
<head> 
    <meta charset='utf-8'> 
    <meta name='viewport' content='width=device-width, initial-scale=1, maximum-scale=1'> 
    <title>Robot naukowy</title> 
    <link rel='stylesheet' href='css/style.css'> 

    <!-- dynamic form - script --> 

    <script type="text/javascript"> 

    window.onload = Load; 
var numberOfAuthors = 0; 


function Load() 
{ 
    document.getElementById('add_input').onclick = AddElement; 
} 

function AddElement() 
{ 
    var element1 = document.createElement('input'); 
    var element2 = document.createElement('input'); 
    var element3 = document.createElement('input'); 
    var label1 = document.createElement('label'); 
    var label2 = document.createElement('label'); 
    var label3 = document.createElement('label'); 
    var button = document.createElement('input'); 

    var number = numberOfAuthors; 

    label1.innerHTML = "</br>Next Author's Name "+"</br>"; 
    label1.setAttribute('id', 'authorNameLabel' + number); 

    element1.setAttribute('type', 'text'); 
    element1.setAttribute('id', 'authorName' + number); 
    element1.setAttribute('placeholder', "author's name"); 
    label1.appendChild(element1); 

    label2.innerHTML = "</br>Next Author's Initials " + "</br>"; 
    label2.setAttribute('id', 'authorInitialsLabel' + number); 

    element2.setAttribute('type', 'text'); 
    element2.setAttribute('id', 'authorInitials' + number); 
    element2.setAttribute('placeholder', "Author's Initials..."); 
    label2.appendChild(element2); 

    label3.innerHTML = "</br>Next Author's surname" + '</br>'; 
    label3.setAttribute('id', 'authorSurnameLabel' + number); 

    element3.setAttribute('type', 'text'); 
    element3.setAttribute('id', 'authorSurname' + number); 
    element3.setAttribute('placeholder', "Author's surname..."); 
    label3.appendChild(element3); 

    button.setAttribute('onclick', 'removeAuthor(' + number + ')'); 
    button.setAttribute('type', 'button'); 
    button.setAttribute('id', 'removeAuthorButton' + number); 
    button.setAttribute('value', 'Button'); 

    document.forms['add_file'].appendChild(label1); 
    document.forms['add_file'].appendChild(label2); 
    document.forms['add_file'].appendChild(label3); 
    document.forms['add_file'].appendChild(button); 

    numberOfAuthors++; 
} 


function removeELement(id) { 
    var elem = document.getElementById(id); 
    return elem.parentNode.removeChild(elem); 
} 

function removeAuthor(authorId){ 
    removeELement("authorName"+authorId); 
    removeELement("authorInitials"+authorId); 
    removeELement("authorSurname"+authorId); 
    removeELement("removeAuthorButton"+authorId); 
    removeELement("authorNameLabel"+authorId); 
    removeELement("authorInitialsLabel"+authorId); 
    removeELement("authorSurnameLabel"+authorId); 
    numberOfAuthors--; 
    getText(); 
} 

function getText(){ 

    console.log(numberOfAuthors); 

    var div = document.getElementById("readyorder"); 

    var firstAuthorName = document.getElementById("firstAuthorName"); 
    var firstAuthorInitials = document.getElementById("firstAuthorInitials"); 
    var firstAuthorSurname = document.getElementById("firstAuthorSurname"); 
    // var secondAuthorSurname = 
    var authorSurname 


    for(var authorId = 0 ; authorId < numberOfAuthors ; authorId++){ 

     var authorName = document.getElementById("authorName"+authorId); 
     var authorInitials = document.getElementById("authorInitials" + authorId); 
     authorSurname = document.getElementById("authorSurname" + authorId); 


    } 

    var publisher = document.getElementById("publisher"); 

    var page = document.getElementById("page"); 

    var pageOther = document.getElementById("pageOther"); 
    var pageOtherValue = pageOther.value; 

    if(pageOther.value!=""){ 
     pageOtherValue = "-" + pageOther.value; 
    }else{ 
     pageOtherValue = ""; 
    } 

    var year = document.getElementById("year"); 
    var secondAuthorSurname; 
    if(authorId === 0) { 
     div.innerHTML = firstAuthorSurname.value + " (" + year.value + ", s."+page.value + pageOtherValue; 
    } 
    else if (authorId === 1) { 
     div.innerHTML = firstAuthorSurname.value + " and " + authorSurname.value + " (" + year.value + ") "; 

     //secondAuthorSurname = authorSurname.value; 
    } 

    else if (authorId === 2) { 
     div.innerHTML = firstAuthorSurname.value + ", " + authorSurname.value + " and " + authorSurname.value + " (" + year.value + ") "; 

    } 
} 

function handlePages(){ 

    var cboxPageRange = document.getElementById("cboxPageRange"); 

    if (cboxPageRange.checked){ 
     var pageOther = document.getElementById("pageOther"); 
     pageOther.style.display="block"; 
    }else{ 
     var pageOther = document.getElementById("pageOther"); 
     pageOther.style.display="none"; 
     pageOther.value=""; 
     getText(); 
    } 

} 



    </script> 



    </head> 
<body> 

<div class='container'> 

    <!-- header --> 
    <header> 
     <img src="images/header.jpg" alt=""/> 
    </header> 

    <!-- static form 1 --> 

    First Author's Name <br /> 
    <input type="text" id="firstAuthorName" /> <br /> 
    First Author's Initials <br /> 
    <input type="text" id="firstAuthorInitials" /> <br /> 
    First Author's Surname <br /> 
    <input type="text" id="firstAuthorSurname" /> <br /> 

    <!-- dynamic form --> 

<input type="submit" value="Add author" id="add_input" /> 

<form name="add_file" enctype="multipart/form-data" method="post"> 
</form> 



<div id="readyorder"></div><br/> 

    <!-- static form 2 --> 

     Publisher<br /> 
     <input type="text" id="publisher"><br /> 
     Page<br /> 
     <input type="text" id="page"> 
     <input type="checkbox" id="cboxPageRange" value="pageRangeCheckbox" onclick="handlePages()"> 
     <input type="text" id="pageOther" class="pageOther"> 
     <br> 
     Year<br> 
     <input type="text" id="year"><br/> 
     <input type="submit" value="Sprawdź" onclick="getText()" /> <br/><br/> 

     <!-- readyorder --> 

    <div id="readyorder"></div><br/> 

    <!-- sidebar --> 
    <aside> 
     <nav> 
      <ul> 
       <li><a href="index.html">Powrot do strony głownej</a></li> 
       <li><a href="#">Zmien styl</a></li> 

      </ul> 
     </nav> 
    </aside> 


    <!-- main --> 
    <section id="main"> 
     <h1> You made your order</h1><br/> 
     <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras condimentum tempus mi, maximus volutpat urna sollicitudin vitae. Vivamus rutrum mi sit amet commodo rutrum. Suspendisse potenti. Sed a ullamcorper eros. Maecenas dapibus erat mi, a egestas ipsum cursus volutpat. Aliquam posuere mi at consectetur convallis. Cras vitae ligula eget leo ultrices hendrerit nec sed ex. Morbi at ipsum rhoncus, dictum elit in, consectetur lorem. Aliquam suscipit diam sit amet mauris luctus, a egestas magna pharetra. Donec laoreet viverra risus nec fermentum. Maecenas gravida lectus vel ante commodo bibendum. Donec ac pellentesque mi. </p> 
    </section> 

    <!-- footer --> 
    <footer> 
     <p>Lukasz © 2017</p> 
    </footer> 

</div> 

</body> 
</html>

來源

2017-01-07 lookasz

不完全相關，但[循環]（https://developer.mozilla.org/en-US/docs/Learn/JavaScript/Building_blocks/Looping_code）可能會節省幾行。 – Teemu

太多的文字不適合評論，然後把它回答。

看來你在這裏mistaked：

for(var authorId = 0 ; authorId < numberOfAuthors ; authorId++){ 

    var authorName = document.getElementById("authorName"+authorId); 
    var authorInitials = document.getElementById("authorInitials" + authorId); 
    authorSurname = document.getElementById("authorSurname" + authorId); 
}

循環結束後，你將有authorName，authorInitials和authorSurname將有最後一次（第3次）authorId一個值。我想，你閉環太早。

來源

2017-01-07 16:11:25 Banzay

回答

相關問題