<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" dir="ltr" lang="es" xml:lang="es">
<head>
<title>Documento sin título</title>
<script type="text/javascript">
item = [
//africa
[
{pais: 'marruecos',
email : 'www.url.com'},
{pais: 'congo',
email : 'www.url.com'},
{pais: 'mauritania',
email : 'www.url.com'}
],
//america
[
{pais : 'mejico',
email : 'www.url.com'},
{pais : 'bolivia',
email : 'www.url.com'},
{pais : 'argentina',
email : 'www.url.com'},
{pais : 'brasil',
email : 'www.url.com'}
],
//europa
[
{pais : 'españa',
email : 'www.url.com'},
{pais : 'portugal',
email : 'www.url.com'},
{pais : 'estonia',
email : 'www.url.com'}
]
];
var almacena = [];
function fnc(it) {
if (almacena.length) almacena.splice(0,almacena.length);
var itemxpaises = [];
for (var i = 0; i < item[it].length; i++) {
itemxpaises.push({pais2: item[it][i].pais, email2: item[it][i].email});
if(itemxpaises.length) {almacena.push(itemxpaises);}
}
}
function fnc2(val) {
var objItems = document.getElementById('paises');
if (!val.length) {objItems.innerHTML = ''; return;}
objItems.innerHTML = '';
for (var i = 0; i < almacena.length; i++) {
if (almacena[0][i].pais2.substr(almacena[0][i].pais2.toUpperCase().indexOf(val.toUpperCase()), val.length).toUpperCase() == val.toUpperCase()){
objItems.innerHTML += almacena[0][i].pais2 + ' - ' + almacena[0][i].email2 + '<br />';
}
}
}
</script>
</head>
<body>
<form>
<p>Elije un continente
<select onchange="fnc(this.selectedIndex)">
<option value="">áfrica</option>
<option value="">america</option>
<option value="">europa</option>
</select>
</p>
<p>Escribe un país
<input type="text" id="txt" name="txt" onkeyup="fnc2(this.value)" />
<div id="paises"></div>
</p>
</body>
</html>