get icon name and show it in input with JS

Question

get icon name and show it in input with JS

Navigation

#1 by (2 votes)

0

How to do so that by giving click icon, I can send the icon name to input , in this case I need to send input what contains the class of my tag i < i class="fa fa-android"> < /i>

javascript html5 html

asked by Ivxn 17.11.2017 в 05:05

source

1 answer

Shutdown and restart operating system with javascript In Javascript. Where the default values are passed in a daughter class (extends). In "super" or in the "constructor"

score 2 · Accepted Answer

You could add a listener to the class fa that all the icons of font-awesome have, in addition to get the class of the element with className .

//Seleccionamos todos los Iconos
var iconos = document.querySelectorAll('.fa');
//El Input a dondese enviará el valor de la clase
var input = document.getElementById('valorIcon');
//Iteramos sobre los iconos para agregar el Listener
for (var i = 0; i < iconos.length; i++) {
  //agregamos el Listener para el evento click
	iconos[i].addEventListener('click',function(){
    // asignamos al input el valor de la clase.
		input.value = this.className;
	});
}

<link rel="stylesheet"  href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css" >
<i class="fa fa-star" aria-hidden="true"></i>
<i class="fa fa-android" aria-hidden="true"></i>
<input type="text" id="valorIcon">