Hoe bel ik Onclick op een RadioButton-lijst met JavaScript?
Antwoord 1, Autoriteit 100%
Hoe genereert u de lijst met keuzerinnen? Als u alleen HTML gebruikt:
<input type="radio" onclick="alert('hello');"/>
Als u deze via iets als ASP.NET genereert, kunt u dat toevoegen als een attribuut aan elk element in de lijst. U kunt dit uitvoeren nadat u uw lijst hebt ingevuld, of deze inline bent als u uw lijst één voor één opbouwt:
foreach(ListItem RadioButton in RadioButtons){
RadioButton.Attributes.Add("onclick", "alert('hello');");
}
Meer info: http://www.w3schools.com/jsref/event_onclick.asp
Antwoord 2, Autoriteit 57%
Om de Onclick-gebeurtenis op een radioknop te activeren, roept u de click()methode op het DOM-element:
document.getElementById("radioButton").click()
JQuery gebruiken:
$("#radioButton").click()
Angularjs:
angular.element('#radioButton').trigger('click')
Antwoord 3, Autoriteit 38%
Ik ben het eens met @annakata dat deze vraag wat meer verduidelijking nodig heeft, maar hier is een zeer, zeer basisch voorbeeld van het instellen van een onclickEvenement Handler voor de keuzerondjes:
<html>
<head>
<script type="text/javascript">
window.onload = function() {
var ex1 = document.getElementById('example1');
var ex2 = document.getElementById('example2');
var ex3 = document.getElementById('example3');
ex1.onclick = handler;
ex2.onclick = handler;
ex3.onclick = handler;
}
function handler() {
alert('clicked');
}
</script>
</head>
<body>
<input type="radio" name="example1" id="example1" value="Example 1" />
<label for="example1">Example 1</label>
<input type="radio" name="example2" id="example2" value="Example 2" />
<label for="example1">Example 2</label>
<input type="radio" name="example3" id="example3" value="Example 3" />
<label for="example1">Example 3</label>
</body>
</html>
Antwoord 4, autoriteit 17%
Het probleem hier is dat de weergave van een RadioButtonList de afzonderlijke keuzerondjes (ListItems) in span-tags verpakt en zelfs wanneer u een gebeurtenishandler aan de clientzijde rechtstreeks toewijst aan het lijstitem met attributen, wordt de gebeurtenis aan de span toegewezen. Door de gebeurtenis toe te wijzen aan de RadioButtonList, wordt deze toegewezen aan de tabel waarin deze wordt weergegeven.
De truc hier is om de ListItems op de aspx-pagina toe te voegen en niet vanuit de code erachter. Vervolgens kunt u de JavaScript-functie toewijzen aan de eigenschap onClick. Deze blogpost; client-side event-handler aan de lijst met keuzerondjes toevoegen door Juri Strumpflohnerlegt het allemaal uit.
Dit werkt alleen als je de ListItems van tevoren kent en helpt niet waar de items in de RadioButtonList dynamisch moeten worden toegevoegd met de code erachter.
Antwoord 5, autoriteit 10%
Hi, I think all of the above might work. In case what you need is simple, I used:
<body>
<div class="radio-buttons-choice" id="container-3-radio-buttons-choice">
<input type="radio" name="one" id="one-variable-equations" onclick="checkRadio(name)"><label>Only one</label><br>
<input type="radio" name="multiple" id="multiple-variable-equations" onclick="checkRadio(name)"><label>I have multiple</label>
</div>
<script>
function checkRadio(name) {
if(name == "one"){
console.log("Choice: ", name);
document.getElementById("one-variable-equations").checked = true;
document.getElementById("multiple-variable-equations").checked = false;
} else if (name == "multiple"){
console.log("Choice: ", name);
document.getElementById("multiple-variable-equations").checked = true;
document.getElementById("one-variable-equations").checked = false;
}
}
</script>
</body>Antwoord 6, Autoriteit 7%
Probeer de oplossing
HTML:
<div id="variant">
<label><input type="radio" name="toggle" class="radio" value="19,99€"><span>A</span></label>
<label><input type="radio" name="toggle" class="radio" value="<<<"><span>B</span></label>
<label><input type="radio" name="toggle" class="radio" value="xxx"><span>C</span></label>
<p id="price"></p>
JS:
$(document).ready(function () {
$('.radio').click(function () {
document.getElementById('price').innerHTML = $(this).val();
});
});
Antwoord 7
De andere antwoorden werkten niet voor mij, dus ik controleerde Telerik’s officiële documentatieer staat dat je de knop moet vinden en de functie click()moet aanroepen:
function KeyPressed(sender, eventArgs) {
var button = $find("<%= RadButton1.ClientID %>");
button.click();
}