Блог

Главная - Вопросы по программированию - создание списка книг на Javascript

создание списка книг на Javascript

#javascript #html #parallel-arrays

Вопрос:

У меня возникли проблемы с сортировкой списка книг, который я создаю для задания. Названия книг должны перемещаться вместе с датами и сортироваться от самых старых к самым новым после нажатия кнопки. Однако я не знаю, почему Дон Кихот и Моби Дик не появляются после нажатия кнопки. Есть ли что-то, чего мне не хватает, или я поступил неправильно? Помощь приветствуется.

     var names = new Array("To Kill a Mockingbird","Jaws","Don Quixote","Moby-Dick","Northern Lights");
    var published = new Array("July 11, 1960", "February 1, 1974","July 11, 1615","October 18, 1851","November 12, 1995");

function display()
{
    for(var i = 0; i < names.length; i  )
    {
        var temp = "cell"   i   "0";
        document.getElementById(temp).innerHTML = names[i];
        temp = "cell"   i   "1";
        document.getElementById(temp).innerHTML = published[i];
    }
    
}

function SortIt( )
{
    var oldest  = 0;
    var index = 0; 
    var j = 0;
    var k = 0;
    var count = 0;
    var temp = 0; var temp2 = "";
    
    count = published.length;
    count = names.length;
    
    for (k =0; k <= (count -1); k   )
    {
        oldest = Date.parse(published[k]);
        index = k;
         
        for (j = (k   1); j <= (count-1); j  )
        {
            
            if (Date.parse(published[j]) < oldest ) 
            {
                oldest = Date.parse(published[j]);
                index = j;
                
            }
        }
        if(k != index)
        {
            temp = published[k];
            published[k] = published[index];
            published[index] = temp;
            temp2 = names[k];
            names[k] = index[k];
            names[index] = temp2;
        }
    }
    display();
} 
 <!DOCTYPE html>
<html lang="en">
<head>
<title>Program 9 - Selection Sort</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />


<script type="text/javascript" src="Carbajal_Lab9.js"></script>
</head>
<body  onload="display()">
<h1>Program 9 - Selection Sort</h1>

<table id ="workTable" border ="2">
    <tr>
    <td> <span id = "cell00"/> </td>
    <td> <span id = "cell01"/> </td>
    </tr>
    
    <tr>
    <td> <span id = "cell10"/> </td>
    <td> <span id = "cell11"/> </td>
    </tr>
    
    <tr>
    <td> <span id = "cell20"/> </td>
    <td> <span id = "cell21"/> </td>
    </tr>
    
    <tr>
    <td> <span id = "cell30"/> </td>
    <td> <span id = "cell31"/> </td>
    </tr>
    
    <tr>
    <td> <span id = "cell40"/> </td>
    <td> <span id = "cell41"/> </td>
    </tr>

</table>
<form>
    <input type="button" value="Sort" onclick="SortIt()"/>
</form>
</body>
</html>

Комментарии:

1. names[k] = index[k]; должно ли это быть names[k] = names[index]; так ?

2. спасибо вам за исправление!

3. Это сработало, еще раз спасибо. Я не знаю, как я пропустил такую простую ошибку.

Ответ №1:

В

  temp = published[k];
            published[k] = published[index];
            published[index] = temp;
            temp2 = names[k];
            names[k] = index[k];
            names[index] = temp2;

вы устанавливаете names[k] как index[k] , хотя index это int/счетчик.

Что работает для меня , так это создание клонов published и names , чтобы, когда вы пытаетесь ввести значение из старого списка, вы могли ссылаться, например, oldnames .

Переменная count также задается как 2 разных значения подряд,. Я заменил этот раздел вызовом Math.min , который выбирает наименьшую из 2 длин массива (предотвращение недопустимых запросов индекса).

Наконец, я спас вас от написания html-кода, создав цикл в javascript, который создает исходную таблицу

 var names = new Array("To Kill a Mockingbird","Jaws","Don Quixote","Moby-Dick","Northern Lights");
    var published = new Array("July 11, 1960", "February 1, 1974","July 11, 1615","October 18, 1851","November 12, 1995");
var count = Math.min(names.length,published.length);
function drawTable(){
    for(var i = 0; i < count; i  )
    {
        document.getElementById('workTable').innerHTML ="<tr>" 
        "<td> <span id="cell" i "0"" "/></td>" 
        "<td> <span id="cell" i "1"" "/></td>" 
        "</tr>"
    }
}
function display()
{
    for(var i = 0; i < count; i  )
    {
        var temp = "cell"   i   "0";
        document.getElementById(temp).innerHTML = names[i];
        temp = "cell"   i   "1";
        document.getElementById(temp).innerHTML = published[i];
    }
    
}

function SortIt( )
{
    var oldPublished=published.slice();
    var oldNames = names.slice();
    var oldest  = 0;
    var index = 0; 
    var j = 0;
    var k = 0;
    var temp = 0; var temp2 = "";
    
    for (k =0; k <= (count -1); k   )
    {
        oldest = Date.parse(published[k]);
        index = k;
         
        for (j = (k   1); j <= (count-1); j  )
        {
            
            if (Date.parse(published[j]) < oldest ) 
            {
                oldest = Date.parse(published[j]);
                index = j;
                
            }
        }
        if(k != index)
        {
            temp = published[k];
            published[k] = oldPublished[index];
            published[index] = oldPublished[k];
            temp2 = names[k];
            names[k] = oldNames[index];
            names[index] = oldNames[k];
        }
    }
    display();
}
drawTable(); 
 <!DOCTYPE html>
<html lang="en">
<head>
<title>Program 9 - Selection Sort</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />


<script type="text/javascript" src="Carbajal_Lab9.js"></script>
</head>
<body  onload="display()">
<h1>Program 9 - Selection Sort</h1>

<table id ="workTable" border ="2">
</table>
<form>
    <input type="button" value="Sort" onclick="SortIt()"/>
</form>
</body>
</html>
Метки: