JSFiddle - React, Tailwind, and code Playground

by Lucas Fontes Gaspareto

HTML

<select id="selectid" onChange="getData(this);" >
	<option value="option1">Deplacement</option>
	<option value="option2">lignes</option>
</select>

<div onclick="clicked(this);"></div>

CSS

div {
    background: lightgray;
    height: 100px;
    margin: 10px;
    width: 200px;
}

JavaScript

// Variavel definina em escopo global.
var option = 0;

function getData(elemento) {
  
  // atribui valor a variavel option usando o operador ternário.
  this.option = elemento.value === 'option1' ? 1 : 2;
}

function clicked(elemento) {
	if(this.option === 2) {
    	elemento.innerHTML = "você clicou e a cor mudou.";
        elemento.style.background = 'tomato';
    } else {
        elemento.innerHTML = "você pode até clicar mas nada acontecerá.";
    }
}