Passing href address on a datalist

[juvenalb]

how do I get redirected to the "href" and not to the "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>

[Oba22]

You can do the following, the way the event delegates should be https://developer.mozilla.org/en-US/docs/Web/Events/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>
<input list="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>