2017-06-17 51 views
1

如果我从选择菜单中选择电影,它不会返回数组programmazione中存在的电影的标题。javascript错误返回选择html

var programmazione = [{ 
 
    titolo: 'matrix', 
 
    cinema: ['garibaldi', 'politeama'] 
 
    }, 
 
    { 
 
    titolo: 'limitless', 
 
    cinema: ['politeama', 'italia'] 
 
    }, 
 
    { 
 
    titolo: 'forrest gump', 
 
    cinema: ['italia', 'popoazzurra'] 
 
    } 
 
]; 
 

 
var nodoSelectCinema; 
 
var nodoMostraFilm; 
 
var nodoListaFilm; 
 

 
function calcolaListaFilm(cinema) { 
 
    try { 
 
    var listaFilm = []; 
 
    for (var i = 0; i < programmazione.length; i++) { 
 
     var film = programmazione[i]; 
 
     var j = 0; 
 
     while ((j < film.cinema.length) && film.cinema[i] != cinema) { 
 
     j++; 
 
     } 
 
     if (j < film.cinema.length) { 
 
     listaFilm.push(film.titolo); 
 
     } 
 
    } 
 
    console.log(listaFilm); 
 
    return listaFilm; 
 
    } catch (e) { 
 
    alert("calcolaListaFilm" + e); 
 
    } 
 
} 
 

 
function calcolaListaCinema() { 
 
    try { 
 
    var listaCinema = {}; 
 
    for (var i = 0; i < programmazione.length; i++) { 
 
     var film = programmazione[i]; 
 
     for (var j = 0; j < film.cinema.length; j++) { 
 
     var cinema = film.cinema[j]; 
 
     listaCinema[cinema] = true; 
 
     } 
 
    } 
 
    return listaCinema; 
 
    } catch (e) { 
 
    alert("calcolaListaCinema" + e); 
 
    } 
 
} 
 

 

 
function visualizzaListaFilm(listaFilm) { 
 
    try { 
 
    while (nodoListaFilm.childNodes.length > 0) { 
 
     nodoListaFilm.removeChild(nodoListaFilm.firstChild); 
 
    } 
 
    for (var i = 0; i < listaFilm.length; i++) { 
 
     var film = listaFilm[i]; 
 
     var nodoFilm = document.createElement("li"); 
 
     nodoListaFilm.appendChild(nodoFilm); 
 
     var nodoTesto = document.createTextNode(film); 
 
     nodoFilm.appendChild(nodoTesto); 
 
    } 
 
    } catch (e) { 
 
    alert("visualizzaListaFilm" + e); 
 
    } 
 
} 
 

 
function creaSelect(nodoSelect, opzioni) { 
 
    try { 
 
    for (var opzione in opzioni) { 
 
     var nodoOpzione = document.createElement("option"); 
 
     nodoOpzione.value = opzione; 
 
     var nodoTesto = document.createTextNode(opzione); 
 
     nodoOpzione.appendChild(nodoTesto); 
 
     nodoSelect.appendChild(nodoOpzione); 
 
    } 
 
    } catch (e) { 
 
    alert("creaSelect" + e); 
 
    } 
 
} 
 

 
function gestoreMostraFilm() { 
 
    try { 
 
    var cinema = nodoSelectCinema.value; 
 
    var listaFilm = calcolaListaFilm(cinema); 
 
    visualizzaListaFilm(listaFilm); 
 
    } catch (e) { 
 
    alert("gestoreMostraFilm" + e); 
 
    } 
 
} 
 

 
function inzializza() { 
 
    try { 
 
    nodoSelectCinema = document.getElementById("selectCinema"); 
 
    nodoMostraFilm = document.getElementById("mostraFilm"); 
 
    nodoListaFilm = document.getElementById("listaFilm"); 
 
    var listaCinema = calcolaListaCinema(); 
 
    creaSelect(nodoSelectCinema, listaCinema); 
 
    nodoListaFilm.onclick = gestoreMostraFilm(); 
 
    } catch (e) { 
 
    alert("inizializza" + e); 
 
    } 
 
} 
 

 
window.onload = inzializza;
<select id="selectCinema"></select> 
 
<input type="button" id="mostraFilm" value="Mostra Film"> 
 
<br> 
 
<ol id="listaFilm"></ol>

+0

我不知道这是不工作的功能,如果我知道,我没有写: D返回选择选项的函数是creaSelect()和calcolaListaCinema() – jacopotaba

+1

该脚本起作用(如果我们忽略这条线'nodoListaFilm.onclick = gestoreMostraFilm();'的概率是probabl错了):https://jsfiddle.net/d5pgnkj6/; 'inzializza()'被执行了吗? – Andreas

+0

该脚本起作用,它会创建选择选项,但如果更改该选项,则结果不会更改。 inizializza执行 – jacopotaba

回答

2

我发现了两个地方,你可以作出这样应该可以解决你的代码更改。

首先,您没有为您的按钮分配点击侦听器。

nodoListaFilm.onclick = gestoreMostraFilm(); 

应该

nodoMostraFilm.addEventListener('click', gestoreMostraFilm); 

其次,在你的calcolaListaFilm功能while循环是指向我,而不是j的。

while ((j < film.cinema.length) && film.cinema[i] != cinema) { 

应该

while ((j < film.cinema.length) && film.cinema[j] != cinema) { 

var programmazione = [{ 
 
    titolo: 'matrix', 
 
    cinema: ['garibaldi', 'politeama'] 
 
    }, 
 
    { 
 
    titolo: 'limitless', 
 
    cinema: ['politeama', 'italia'] 
 
    }, 
 
    { 
 
    titolo: 'forrest gump', 
 
    cinema: ['italia', 'popoazzurra'] 
 
    } 
 
]; 
 

 
var nodoSelectCinema; 
 
var nodoMostraFilm; 
 
var nodoListaFilm; 
 

 
function calcolaListaFilm(cinema) { 
 
    try { 
 
    var listaFilm = []; 
 
    for (var i = 0; i < programmazione.length; i++) { 
 
     var film = programmazione[i]; 
 
     var j = 0; 
 
     while ((j < film.cinema.length) && film.cinema[j] != cinema) { 
 
     j++; 
 
     } 
 
     if (j < film.cinema.length) { 
 
     listaFilm.push(film.titolo); 
 
     } 
 
    } 
 
    console.log(listaFilm); 
 
    return listaFilm; 
 
    } catch (e) { 
 
    alert("calcolaListaFilm" + e); 
 
    } 
 
} 
 

 
function calcolaListaCinema() { 
 
    try { 
 
    var listaCinema = {}; 
 
    for (var i = 0; i < programmazione.length; i++) { 
 
     var film = programmazione[i]; 
 
     for (var j = 0; j < film.cinema.length; j++) { 
 
     var cinema = film.cinema[j]; 
 
     listaCinema[cinema] = true; 
 
     } 
 
    } 
 
    return listaCinema; 
 
    } catch (e) { 
 
    alert("calcolaListaCinema" + e); 
 
    } 
 
} 
 

 

 
function visualizzaListaFilm(listaFilm) { 
 
    try { 
 
    while (nodoListaFilm.childNodes.length > 0) { 
 
     nodoListaFilm.removeChild(nodoListaFilm.firstChild); 
 
    } 
 
    for (var i = 0; i < listaFilm.length; i++) { 
 
     var film = listaFilm[i]; 
 
     var nodoFilm = document.createElement("li"); 
 
     nodoListaFilm.appendChild(nodoFilm); 
 
     var nodoTesto = document.createTextNode(film); 
 
     nodoFilm.appendChild(nodoTesto); 
 
    } 
 
    } catch (e) { 
 
    alert("visualizzaListaFilm" + e); 
 
    } 
 
} 
 

 
function creaSelect(nodoSelect, opzioni) { 
 
    try { 
 
    for (var opzione in opzioni) { 
 
     var nodoOpzione = document.createElement("option"); 
 
     nodoOpzione.value = opzione; 
 
     var nodoTesto = document.createTextNode(opzione); 
 
     nodoOpzione.appendChild(nodoTesto); 
 
     nodoSelect.appendChild(nodoOpzione); 
 
    } 
 
    } catch (e) { 
 
    alert("creaSelect" + e); 
 
    } 
 
} 
 

 
function gestoreMostraFilm() { 
 
    try { 
 
    var cinema = nodoSelectCinema.value; 
 
    var listaFilm = calcolaListaFilm(cinema); 
 
    visualizzaListaFilm(listaFilm); 
 
    } catch (e) { 
 
    alert("gestoreMostraFilm" + e); 
 
    } 
 
} 
 

 
function inzializza() { 
 
    try { 
 
    nodoSelectCinema = document.getElementById("selectCinema"); 
 
    nodoMostraFilm = document.getElementById("mostraFilm"); 
 
    nodoListaFilm = document.getElementById("listaFilm"); 
 
    var listaCinema = calcolaListaCinema(); 
 
    creaSelect(nodoSelectCinema, listaCinema); 
 
    nodoMostraFilm.addEventListener('click', gestoreMostraFilm); 
 
    } catch (e) { 
 
    alert("inizializza" + e); 
 
    } 
 
} 
 

 
window.onload = inzializza;
<select id="selectCinema"></select> 
 
<input type="button" id="mostraFilm" value="Mostra Film"> 
 
<br> 
 
<ol id="listaFilm"></ol>

+0

它的作品,完美!谢谢!你知道为什么如果我写nodoMostraFilm.onclick = gestoreMostraFilm();不起作用,但如果写了nodoMostraFilm.onclick = gestoreMostraFilm;有用。你知道为什么吗? – jacopotaba

+0

添加()执行该功能。您想要将该功能分配给click事件,而不是执行它。它应该只在点击事件发生时执行。 –

+0

对!再次感谢你 :) – jacopotaba