неупорядоченный список из элементов массива с использованием innerHTML в Javascript - PullRequest
Новая
       2

неупорядоченный список из элементов массива с использованием innerHTML в Javascript

0 голосов
/ 06 октября 2011

Я пытаюсь добавить маркированный список на страницу после того, как пользователь вводит 'exit' в приглашение;список не должен включать термин «выход».Я смог получить список полностью, используя document.write, но он включал «выход» и избавился от форматирования моей страницы.Я уверен, что мне нужно использовать innerHTML, но когда я делаю это, все, что я получаю, это страница без каких-либо элементов массива.Любая помощь с благодарностью. 

<html>
<head>
    <img src="http://profperry.com/Classes20/JavaScript/lordoftherings.png" />
    <title>Javascript Test</title>
    <script>
    function askMe() {
        var fav_characterList = new Array();
        i = 0;
        var fav_character = "";

        while(fav_character != 'exit'){

            fav_character = prompt("Who's your favorite Lord of the Rings character\n\n Enter 'exit' to stop prompting", "");
            fav_characterList[i] = fav_character;

            i++;
        } 

        n = (fav_characterList.length);
        for(i = 0; i <= (n-1); i++){
            var list = fav_characterList[i];
            var MyList = getElementById('results');
            MyList.innerHTML = "<li>"+list+"</li>";


        }


    } 







    </script>

</head>
<body onload="askMe()">
    <ul>

        <div id="results">


        </div>
    </ul>


        <br/>
        <br/>

</body>

Ответы [ 2 ]

1 голос
/ 06 октября 2011

Вы должны использовать document.getElementById () , а также генерировать строку внутри цикла и использовать внутренний html после цикла, чтобы предыдущий li не перезаписывался.

обновить порции кода как 

n = (fav_characterList.length);
    var kk="";

    for(i = 0; i <= (n-1); i++){
        var list = fav_characterList[i];
        kk += "<li>"+list+"</li>"


    }
var MyList = document.getElementById('results');        
MyList.innerHTML = kk;

и в html удалите div внутри ul и предоставьте id для ul 

 <ul id="results">


        </ul>

и вот полный код становится: 

<html>
<head>
<img src="http://profperry.com/Classes20/JavaScript/lordoftherings.png" />
<title>Javascript Test</title>
<script type="text/javascript">
    function askMe() 
{
    var fav_characterList = new Array();
    i = 0;
    var fav_character = "";

            while(fav_character != 'exit')
    {

            fav_character = prompt("Who's your favorite Lord of the Rings character\n\n Enter 'exit' to stop prompting", "");
            fav_characterList[i] = fav_character;
            i++;
            } 

    n = (fav_characterList.length);
    var kk="";

            for(i = 0; i <= (n-1); i++)
    {
            var list = fav_characterList[i];
            kk += "<li>"+list+"</li>"
    }

    var MyList = document.getElementById('results');
    MyList.innerHTML = kk;

    } 
    </script>

</head>
<body onload="askMe()">
    <ul id="results">
    </ul>
<br/>
<br/>
</body>
</html>
0 голосов
/ 06 октября 2011

Вы должны использовать MyList.innerHTML += "<li>"+list+"</li>"; (обратите внимание на использование += вместо =)

Кроме того, измените свой <ul> HTML на:

... 

<ul id="results">
</ul>

...

...