JSFiddle - React, Tailwind, and code Playground
HTML
<form>
<h1>Zwei verschiedene Werte eingeben</h1>
<p>A: <input type="text" name="alpha" /></p>
<p>B: <input type="text" name="beta" /></p>
<p><input type="submit" /></p>
</form>
CSS
[type=text]:valid {
box-shadow: 0 0 1em lime;
}
[type=text]:invalid {
box-shadow: 0 0 1em red;
}
JavaScript
var $inputs = $('input[type=text]');
$inputs.on('change keyup', function(){
if($inputs[0].value == $inputs[1].value){
$inputs[1].setCustomValidity('Zwei _verschiedene_ Werte bitte!');
}
else {
$inputs[1].setCustomValidity('');
}
});