Select 页面上的任何单选按钮
Select any radio button on a page
我有两个单选组,我需要在更改时获取任何单选按钮的值。但是 jQuery 只有 return 单击第二组时第一组单选项的值。
感谢您将 :radio 添加到 .options 的建议 select 或者但我还有其他表单元素,例如 select,我会监视这些元素的变化。我们可以通过任何方式将其添加到变量中吗?
$('.options').change(function() {
var checkedInput = $('.options input:checked').val();
console.log('Checked input is : '+ checkedInput);
alert('Checked input is : '+ checkedInput);
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="options">
<input type="radio" name="group-one" value="pink" checked >
<label for=""> pink </label>
<input type="radio" name="group-one" value="blue">
<label for=""> blue </label>
<input type="radio" name="group-one" value="black">
<label for=""> black </label>
<hr>
<input type="radio" name="group-two" value="orange">
<label for=""> orange </label>
<input type="radio" name="group-two" value="banana">
<label for=""> banana </label>
<input type="radio" name="group-two" value="apple">
<label for=""> apple </label>
</div>
非常接近,只是只有一个 div 带有 .options class 并且所有表单元素都在其中。我只想要一个 var.
中单选按钮的值
$(function () {
var eleToSelect = '.options :radio';
$(eleToSelect).change(function() {
var checkedInput = $(this).val();
console.log('Checked input is : '+ checkedInput);
alert('Checked input is : '+ checkedInput);
$('#result').text('Checked input is : '+ checkedInput); // for the snippet
});
eleToSelect = '.options1 select';
$(eleToSelect).change(function() {
var checkedInput = $(this).val();
console.log('Checked input is : '+ checkedInput);
alert('Checked input is : '+ checkedInput);
$('#result').text('Checked input is : '+ checkedInput); // for the snippet
});
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="options">
<input type="radio" name="group-one" value="pink" checked >
<label for=""> pink </label>
<input type="radio" name="group-one" value="blue">
<label for=""> blue </label>
<input type="radio" name="group-one" value="black">
<label for=""> black </label>
<hr>
<input type="radio" name="group-two" value="orange">
<label for=""> orange </label>
<input type="radio" name="group-two" value="banana">
<label for=""> banana </label>
<input type="radio" name="group-two" value="apple">
<label for=""> apple </label>
<br>
<select>
<option value="volvo">Volvo</option>
<option value="saab">Saab</option>
<option value="mercedes">Mercedes</option>
<option value="audi">Audi</option>
</select>
</div>
我有两个单选组,我需要在更改时获取任何单选按钮的值。但是 jQuery 只有 return 单击第二组时第一组单选项的值。
感谢您将 :radio 添加到 .options 的建议 select 或者但我还有其他表单元素,例如 select,我会监视这些元素的变化。我们可以通过任何方式将其添加到变量中吗?
$('.options').change(function() {
var checkedInput = $('.options input:checked').val();
console.log('Checked input is : '+ checkedInput);
alert('Checked input is : '+ checkedInput);
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="options">
<input type="radio" name="group-one" value="pink" checked >
<label for=""> pink </label>
<input type="radio" name="group-one" value="blue">
<label for=""> blue </label>
<input type="radio" name="group-one" value="black">
<label for=""> black </label>
<hr>
<input type="radio" name="group-two" value="orange">
<label for=""> orange </label>
<input type="radio" name="group-two" value="banana">
<label for=""> banana </label>
<input type="radio" name="group-two" value="apple">
<label for=""> apple </label>
</div>
非常接近,只是只有一个 div 带有 .options class 并且所有表单元素都在其中。我只想要一个 var.
中单选按钮的值$(function () {
var eleToSelect = '.options :radio';
$(eleToSelect).change(function() {
var checkedInput = $(this).val();
console.log('Checked input is : '+ checkedInput);
alert('Checked input is : '+ checkedInput);
$('#result').text('Checked input is : '+ checkedInput); // for the snippet
});
eleToSelect = '.options1 select';
$(eleToSelect).change(function() {
var checkedInput = $(this).val();
console.log('Checked input is : '+ checkedInput);
alert('Checked input is : '+ checkedInput);
$('#result').text('Checked input is : '+ checkedInput); // for the snippet
});
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="options">
<input type="radio" name="group-one" value="pink" checked >
<label for=""> pink </label>
<input type="radio" name="group-one" value="blue">
<label for=""> blue </label>
<input type="radio" name="group-one" value="black">
<label for=""> black </label>
<hr>
<input type="radio" name="group-two" value="orange">
<label for=""> orange </label>
<input type="radio" name="group-two" value="banana">
<label for=""> banana </label>
<input type="radio" name="group-two" value="apple">
<label for=""> apple </label>
<br>
<select>
<option value="volvo">Volvo</option>
<option value="saab">Saab</option>
<option value="mercedes">Mercedes</option>
<option value="audi">Audi</option>
</select>
</div>