få 4 checkboxe til at virke som radioboxe
Jeg har fundet 2 javascript filer som ved den rigtige indtastning skal kunne virke. Jeg tænker, at den skal gøre følgende når man klikker på den ene slukker den anden og omvendt som i fil 1. Der skal klikkes i combiboksen som i den anden og der skal vises et tekststykke som i fil 2. Jeg håber der er et geni der kan hjælpe mig.-------------------------------------------------------------------------------------------------------
Fil 1:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>jQuery Check/Uncheck Checkbox</title>
<script src="https://code.jquery.com/jquery-3.5.1.min.js"></script>
<script>
$(document).ready(function(){
$(".check").click(function(){
$("#myCheck").prop("checked", true),
$("#nyCheck").prop("checked", false);
});
$(".checken").click(function(){
$("#nyCheck").prop("checked", true),
$("#myCheck").prop("checked", false);
});
});
</script>
</head>
<body>
<p><input type="checkbox" id="myCheck"> Are you sure?</p>
<p><input type="checkbox" id="nyCheck"> Yes I'm sure!</p>
<button type="button" class="check">Yes-my</button>
<button type="button" class="checken">Yes-ny</button>
</body>
</html>
-----------------------------------------------------------------------------------------------------
Fil2:
<!DOCTYPE html>
<html>
<body>
<p>Display some text when the checkbox is checked:</p>
<label for="myCheck">Checkbox:</label>
<input type="checkbox" id="myCheck" onclick="myFunction()">
<input type="checkbox" id="nyCheck" onclick="nyFunction()">
<p id="text1" style="display:none">Checkbox is CHECKED!</p>
<p id="text2" style="display:none">Checkbox is olso CHECKED!</p>
<script>
function myFunction() {
var checkBox = document.getElementById("myCheck");
var text1 = document.getElementById("text1");
if (checkBox.checked == true){
text1.style.display = "block";
} else {
text1.style.display = "none";
}
}
function nyFunction() {
var checkBox = document.getElementById("nyCheck");
var text2 = document.getElementById("text2");
if (checkBox.checked == true){
text2.style.display = "block";
} else {
text2.style.display = "none";
}
}
</script>
</body>
</html>