Une partie du JavaScript ici n'est pas du JavaScript natif, mais utilise un plugin appelé jQuery qui facilite la recherche et la manipulation des éléments HTML.
Quand vous voyez $()
C'est la façon jQuery de trouver des éléments. Mais cela ne fonctionnera pas car vous n'avez pas du tout référencé jQuery.
Si vous ne voulez pas utiliser jQuery, vous pouvez trouver des éléments avec quelque chose comme document.getElementById('label')
.
Mais beaucoup de gens utilisent jQuery pour rendre le référencement des éléments de la page plus court et plus doux, comme avec $('#label')
.
Essayez de faire référence à jQuery en premier, comme :
<!DOCTYPE html><html>
<head>
<!-- The below line references an externally hosted copy of jQuery 2.2.4 -->
<script type="text/javascript" src="https://code.jquery.com/jquery-2.2.4.min.js"></script>
<script>
// The below chunk is telling it to bind to the keyup event only AFTER the document has fully loaded.
// Sometimes when your binding code is executed, the elements you wish to bind to aren't loaded yet.
$(document).ready(function(){
$("#label").bind("keyup", changed).bind("change", changed);
});
function changed() {
$("#url").val(this.value);
}
</script>
</head>
<body>
<input type="text" id="label" />
<input type="text" id="url" readonly />
</body>
</html>