2015-05-12 3 views
0

Мне нужно использовать ту же функцию JavaScript, что и Cerca2, в 3 выделенных выделениях. Первый работает, а другие нет. Я попытался решить проблему самостоятельно, но я не могу найти, где она.Используйте ту же функцию javascript в разных selects

EDIT: код редактируется, теперь работает отлично, TNX для всех внушение и поддержки ребята ^^ Это HTML:

<body> 

    Ricerca per Nome: <input type="text" maxlength="20"/> 
    <input id="cerca1" type="button" value="Cerca" /><br/><br/> 

Ricerca personaggi per Fazione: 
<select id="factionSelect"> 
    <option>UNSC</option> 
    <option>Covenant</option> 
    <option>Flood</option> 
    <option>Precursori</option> 
</select>&nbsp;&nbsp;<input id="cerca2" selectid="factionSelect" type="button" value="Cerca"/> 

<br/><br/> 

Ricerca armi per tipo: 
<select id="weaponSelect"> 
    <option>cinetiche</option> 
    <option>plasma</option> 
    <option>energia</option> 
</select>&nbsp;&nbsp;<input id="cerca5" selectid="weaponSelect" type="button" value="Cerca"/> 

<br/><br/> 

Ricerca Veicoli per impiego: 
<select id="vehicleSelect"> 
    <option>terrestri</option> 
    <option>volanti</option> 
    <option>Astronavi</option> 
</select>&nbsp;&nbsp;<input id="cerca6" selectid="vehicleSelect" type="button" value="Cerca"/> 

    <input id="cerca3" type="button" value="Mostra tutto"/> 
    <input id="cerca4" type="button" value="Ricerca casuale"/><br/><br/> 

    <hr id="barra"/><br/><p>Risultati ricerca:</p> 

    <div id="risultati"> 
    <ol id="ricerca"> 
    <li class="vuoto"></li> 
    </ol> 

    </div> 
</body> 

Это JavaScript:

function Profilo(nom, appar, prof, grup, img){ 

    this.nome = nom; 
    this.apparizione = appar; 
    this.profilo = prof; 
    this.gruppo = grup; 
    this.immagine = img; 
} 


function Archivio(){ 

    this.lista = []; 

    this.inizializza = function(nodo){ 
     var schede = nodo.getElementsByTagName("scheda"); 

     for(var i = 0; i<schede.length; i++){ 

      var categoria = schede[i].getAttribute("categoria"); 
      var nomi = schede[i].getElementsByTagName("nome"); 
      var nome = nomi[0].firstChild.nodeValue; 
      var apparizioni = schede[i].getElementsByTagName("apparizione"); 
      var apparizione = apparizioni[0].firstChild.nodeValue; 
      var profili = schede[i].getElementsByTagName("profilo"); 
      var profilo = profili[0].firstChild.nodeValue; 
      var immagini = schede[i].getElementsByTagName("immagine"); 
      var immagine = immagini[0].firstChild.nodeValue; 

      var scheda = new Profilo(nome, apparizione, profilo, categoria,immagine); 
      this.lista.push(scheda); 
     } 
    } 

    this.cerca1 = function(testo){ 
     var risultato = []; 
     var trovato = 0; 
     var i = 0; 

     while(i<this.lista.length && trovato == 0){ 
      if(this.lista[i].nome == testo) 
      { 
       trovato = 1; 
       risultato.push(this.lista[i]); 
      } 
      else 
       i++; 
     } 

     if(trovato == 1) 
      return risultato; 
     else 
     { 
      risultato[0] = null; 
      return risultato; 
     } 
    } 

    this.cerca2 = function(testo){ 
     var risultati = []; 

     for(var i = 0; i<this.lista.length; i++){ 
      if(this.lista[i].gruppo == testo) 
       risultati.push(this.lista[i]); 
     } 
     return risultati; 
    } 



    this.cerca3 = function(numero){ 
     var risultati = []; 

     risultati.push(this.lista[numero]); 

     return risultati; 
    } 

    this.genera = function(valori){ // genera la lista con gli elementi di xml 
     var s = ""; 

     if(valori[0] == null) 
      s = "Nessun risultato"; 
     else{ 
      for(var i = 0; i<valori.length; i++) 
       s = s + '<li><span class="trovato" onclick="mostra(this);">' + valori[i].nome + " " + '</span><br/><ol class="nascosto"><li class="nopallino2"> <img src='+ valori[i].immagine+'> <br/><br/>Profilo: '+ valori[i].profilo +'<br/>Apparizione: ' + valori[i].apparizione +'</li></ol></li><br/><br/>'; 
     } 
     return s; 
    } 

    this.nascondi = function(){ 
     var liste = document.getElementsByTagName("ol"); 

     for(var i = 0; i<liste.length; i++){ 
      if(liste[i].className == "nascosto") 
       liste[i].style.display = "none"; 
     } 
    } 
} 

function cercagruppo(){ 

    /*var elenco = document.getElementById("ricerca"); 
    var menu = document.getElementsByTagName("select"); 

    var scelta = menu[0]; 
    var gruppo = scelta.value; 
    var schede = contenitore.cerca2(gruppo); 
    elenco.innerHTML = contenitore.genera(schede); 
    contenitore.nascondi(); */ 


    var elenco = document.getElementById("ricerca"); 
    var menu = document.getElementById(this.getAttribute("selectid")); 
    var group = menu.value; 
    var schede = contenitore.cerca2(group); 
    elenco.innerHTML = contenitore.genera(schede); 
    contenitore.nascondi(); 


} 


function mostra(nome){ 

    var testo = nome.nextSibling.nextSibling; 

    if(testo.style.display == "none") 
     testo.style.display = "block" 

    else 
     testo.style.display = "none" 
} 

// funzione che cerca le schede relative all'oggetto cercato digitando il nome 
function cercanome(){ 

    var casella = document.getElementsByTagName("input"); 
    var nome; 
    var elenco = document.getElementById("ricerca"); 
    var scheda; 

    nome = casella[0].value; 

    scheda = contenitore.cerca1(nome); 

    elenco.innerHTML = contenitore.genera(scheda); 

    contenitore.nascondi(); 
} 

// funzione per mostrare tutte le schede 
function tutto(){ 

    var elenco = document.getElementById("ricerca"); 

    elenco.innerHTML = contenitore.genera(contenitore.lista); 

    contenitore.nascondi(); 
} 


function generaCasuale(){ 

    var numerogenerato = Math.floor(Math.random()*(parseInt(contenitore.lista.length-1)+1)); 

    if(numerogenerato == randomglobale){ 
     while(numerogenerato == randomglobale) 
      numerogenerato = Math.floor(Math.random()*(parseInt(contenitore.lista.length-1)+1)); 
    } 

    randomglobale = numerogenerato; 
    return numerogenerato; 
} 

// funzione di ricerca casuale 
function casuale(){ 

    var elenco = document.getElementById("ricerca"); 
    var numero = generaCasuale(); 
    var scheda = contenitore.cerca3(numero); 

    elenco.innerHTML = contenitore.genera(scheda); 

    contenitore.nascondi(); 
} 


var contenitore = new Archivio(); 
var randomglobale; 

function inizializza(){ 

    var c1 = document.getElementById("cerca1"); 
    var c2 = document.getElementById("cerca2"); 
    var c3 = document.getElementById("cerca3"); 
    var c4 = document.getElementById("cerca4"); 
    var c5 = document.getElementById("cerca5"); 
    var c6 = document.getElementById("cerca6"); 


    c1.onclick = cercanome; 
    c2.onclick = cercagruppo; 
    c3.onclick = tutto; 
    c4.onclick = casuale; 
    c5.onclick = cercagruppo; 
    c6.onclick = cercagruppo; 


    var nodo = caricaXML("elenco.xml"); 
    contenitore.inizializza(nodo); 
} 

window.onload = inizializza; 
+3

Пожалуйста, найдите время, чтобы создать минимальный пример, который реплицирует проблему. Я сомневаюсь, что этот код необходим, чтобы продемонстрировать эту проблему. –

+0

Какая ошибка вы получаете во время выполнения? Это должно сказать вам, какова фактическая проблема.Откройте консоль разработки вашего браузера (обычно F12, но зависит от используемого браузера) и проверьте вкладку «консоль». Вот где javascript (обычно) записывает материал в. – arkascha

ответ

1

Я m не уверен, что я полностью понимаю вопрос, но в этом коде c5 и c6 все получают входы cerca2:

var c1 = document.getElementById("cerca1"); 
var c2 = document.getElementById("cerca2"); 
var c3 = document.getElementById("cerca3"); 
var c4 = document.getElementById("cerca4"); 
var c5 = document.getElementById("cerca2"); 
var c6 = document.getElementById("cerca2"); 
1

В нескольких частях вашего кода вы выбираете все элементы определенного типа, но используете только первый такой элемент.

Например:

function cercagruppo(){ 
    ... 
    var menu = document.getElementsByTagName("select"); // gets all "select" elements 
    var scelta = menu[0]; // gets value of first "select" element 
    ... 
} 

А также:

function cercanome(){ 
    var casella = document.getElementsByTagName("input"); // gets all "input" elements 
    ... 
    nome = casella[0].value; // gets value of first "input" element 
    ... 
} 

Если вы хотите, чтобы получить значения из всех select и input элементов, вы должны сделать это в явном виде, например, путем зацикливание через массивы menu и casella вместо выбора только их первых элементов.

Edit: Предлагаемый подход к рефакторинга кода

Посмотрев на свой код немного больше, вот подход, я думаю, вы должны принять:

  1. В вашем HTML, добавьте атрибут ID в каждый из ваших select элементов.
  2. Добавить атрибут в свой «cerca2», «cerca5» и «cerca6» кнопки ввода, который указывает на идентификатор соответствующего select элемента
  3. Вы можете получить доступ к атрибуту в функции cercagruppo() и использовать его для выбора соответствует select элемент.

Ваш cercagruppo() функция будет выглядеть следующим образом:

function cercagruppo(){ 
    var ol = document.getElementById("ricerca"); 
    var selection = document.getElementById(this.getAttribute("selectid")); 
    var group = selection.value; 
    var tabs = contenitore.cerca2(group); 
    ol.innerHTML = contenitore.genera(tabs); 
    contenitore.nascondi(); 
} 

Ваш HTML будет в конечном итоге выглядит примерно так:

Ricerca personaggi per Fazione: 
<select id="factionSelect"> 
    <option>UNSC</option> 
    <option>Covenant</option> 
    <option>Flood</option> 
    <option>Precursori</option> 
</select>&nbsp;&nbsp;<input id="cerca2" selectid="factionSelect" type="button" value="Cerca"/> 
<br/><br/> 
Ricerca armi per tipo: 
<select id="weaponSelect"> 
    <option>cinetiche</option> 
    <option>plasma</option> 
    <option>energia</option> 
</select>&nbsp;&nbsp;<input id="cerca5" selectid="weaponSelect" type="button" value="Cerca"/> 
<br/><br/> 
Ricerca Veicoli per impiego: 
<select id="vehicleSelect"> 
    <option>terrestri</option> 
    <option>volanti</option> 
    <option>Astronavi</option> 
</select>&nbsp;&nbsp;<input id="cerca6" selectid="vehicleSelect" type="button" value="Cerca"/> 

Править

И конечно , вы также должны исправить ошибку, указанную @mgarant:

var c1 = document.getElementById("cerca1"); 
var c2 = document.getElementById("cerca2"); 
var c3 = document.getElementById("cerca3"); 
var c4 = document.getElementById("cerca4"); 
var c5 = document.getElementById("cerca5"); // fixed 
var c6 = document.getElementById("cerca6"); // fixed 
+0

hmm ok ill'try, tnx за помощью – Refarth

+0

ok Я попробовал, но им не хорошо, как я могу получить все элементы «выбрать»? – Refarth

+0

@ Refarth Я обновил свой ответ с предложением. И я узнал немного итальянского, читая ваш код ... Граци! – Thriggle

Смежные вопросы