Passing href address in a datalist

0

How do I redirect to "href" and not "value"?

Follow the code.

<form>

<input list="categorias" type="text" placeholder="O que você procura?" >

<datalist id="categorias">

<option value=" ">	</option>
<option value="JOGOS"><a href="jogos.html"></a></option>
<option value=" ">	</option>
<option value="PS4"><a href="PS4.html"></a></option>
<option value="PS3"><a href="PS3.html"></a></option>
<option value="Xbox One"><a href="xboxone.html"></a></option>
<option value="Xbox 360"><a href="xboxone.html"></a></option>
              
<option value=" ">	</option>
<option value="Consoles"><a href="jogos.html"></a></option>
<option value=" ">	</option>
<option value="PS4"><a href="consolesps4.html"></a></option>
<option value="PS4 PRO"><a href="consolesps4pro.html"></a></option>
<option value="Xbox One"><a href="consolesxboxone.html"></a></option>
<option value="Xbox One X"><a href="consolesxboxonex.html"></a></option>

</datalist>

<input type="submit" id="categorias" value="Procurar"/>

</form>
    
asked by anonymous 17.01.2018 / 19:05

1 answer

0

You can do the following so that the event to be delegated should be input :

var href;
function myfunction(){
$('form').on('submit', function(e) {
  e.preventDefault();
  href = $('datalist option[value="' +$('input[list="categorias"]').val()+ '"]').find('a').prop('href');
  if(typeof href !== 'undefined')
    window.location.href = href;
  });
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script><form><inputlist="categorias" type="text" oninput="myfunction()" placeholder="O que você procura?" >

<datalist id="categorias">

<option value=" ">	</option>
<option value="JOGOS"><a href="jogos.html"></a></option>
<option value=" ">	</option>
<option value="PS4"><a href="PS4.html"></a></option>
<option value="PS3"><a href="PS3.html"></a></option>
<option value="Xbox One"><a href="xboxone.html"></a></option>
<option value="Xbox 360"><a href="xboxone.html"></a></option>
              
<option value=" ">	</option>
<option value="Consoles"><a href="jogos.html"></a></option>
<option value=" ">	</option>
<option value="PS4"><a href="consolesps4.html"></a></option>
<option value="PS4 PRO"><a href="consolesps4pro.html"></a></option>
<option value="Xbox One"><a href="consolesxboxone.html"></a></option>
<option value="Xbox One X"><a href="consolesxboxonex.html"></a></option>

</datalist>

<input type="submit" id="categorias" value="Procurar"/>

</form>
    
17.01.2018 / 19:41