我们如何在输入单选按钮时选中它
How can we turn radio button checked when we type its input
如下所示,我有一个包含三个选项的单选按钮组。最后一个是文本输入。当我在文本框中输入内容时,有什么方法可以让最后一个被选中吗?
<input type='radio' name='result' value="0"/><label for="0">False</label><br/>
<input type='radio' name='result' value="1"/><label for="1">True</label><br/>
<input type='radio' name='result' value="2"/><label for="2">
<input type="text" placeholder="Type your result" name="result_answ"></label>
如果你有 jQuery 加载使用这个:
<input type='radio' name='result' value="0"/><label for="0">False</label><br/>
<input type='radio' name='result' value="1"/><label for="1">True</label><br/>
<input type='radio' name='result' value="2"/><label for="2">
<input type="text" placeholder="Type your result" onkeyup="jQuery(this).parent().prev().prop('checked', true)" name="result_answ"></label>
这是一个演示:
http://jsfiddle.net/9q1j36cj/
编辑:
这是非jQuery版本:
<input type='radio' name='result' value="0"/><label for="0">False</label><br/>
<input type='radio' name='result' value="1"/><label for="1">True</label><br/>
<input type='radio' name='result' value="2"/><label for="2">
<input type="text" placeholder="Type your result" onkeyup="this.parentNode.previousSibling.checked = true" name="result_answ"></label>
试试下面的代码。
onload = function(){
document.getElementsByName('result_answ')[0].onkeyup = function(){
if(this.value!==''){
document.getElementsByName('result')[2].setAttribute('checked', true);
}else{
document.getElementsByName('result')[2].removeAttribute('checked')
}
}
}
<input type='radio' name='result' value="0"/><label for="0">False</label><br/>
<input type='radio' name='result' value="1"/><label for="1">True</label><br/>
<input type='radio' name='result' value="2"/><label for="2">
<input type="text" placeholder="Type your result" name="result_answ"></label>
如下所示,我有一个包含三个选项的单选按钮组。最后一个是文本输入。当我在文本框中输入内容时,有什么方法可以让最后一个被选中吗?
<input type='radio' name='result' value="0"/><label for="0">False</label><br/>
<input type='radio' name='result' value="1"/><label for="1">True</label><br/>
<input type='radio' name='result' value="2"/><label for="2">
<input type="text" placeholder="Type your result" name="result_answ"></label>
如果你有 jQuery 加载使用这个:
<input type='radio' name='result' value="0"/><label for="0">False</label><br/>
<input type='radio' name='result' value="1"/><label for="1">True</label><br/>
<input type='radio' name='result' value="2"/><label for="2">
<input type="text" placeholder="Type your result" onkeyup="jQuery(this).parent().prev().prop('checked', true)" name="result_answ"></label>
这是一个演示:
http://jsfiddle.net/9q1j36cj/
编辑: 这是非jQuery版本:
<input type='radio' name='result' value="0"/><label for="0">False</label><br/>
<input type='radio' name='result' value="1"/><label for="1">True</label><br/>
<input type='radio' name='result' value="2"/><label for="2">
<input type="text" placeholder="Type your result" onkeyup="this.parentNode.previousSibling.checked = true" name="result_answ"></label>
试试下面的代码。
onload = function(){
document.getElementsByName('result_answ')[0].onkeyup = function(){
if(this.value!==''){
document.getElementsByName('result')[2].setAttribute('checked', true);
}else{
document.getElementsByName('result')[2].removeAttribute('checked')
}
}
}
<input type='radio' name='result' value="0"/><label for="0">False</label><br/>
<input type='radio' name='result' value="1"/><label for="1">True</label><br/>
<input type='radio' name='result' value="2"/><label for="2">
<input type="text" placeholder="Type your result" name="result_answ"></label>