单选按钮未设置为选中
Radio button doesn't set as checked
我做了一些测试- http://magora-systems-test.esy.es/,其中一个任务是通过JavaScript(jQuery)使单选按钮静态化。我一次又一次地重新构建,但总是有一个问题:JS成功地将输入单选按钮属性设置为checked="checked",通过单击风格化的克隆,但它没有设置为chosen,并且需要的属性会话相同。我不明白为什么?
HTML:<fieldset class="userAge">
<div class="fieldName">
Возраст:
</div>
<div class="overflow">
<input type="radio" name="userAge" id="seventeen" title="Выберите если вы младше 17" required>
<label for="seventeen">17 и младше</label>
<input type="radio" name="userAge" id="eighteen" title="Выберите если вы старше 18" required>
<label for="eighteen">18 и старше</label>
</div>
</fieldset>
JS:
;(function($) {
// Расширяем набор элементов jQuery новым плагином.
$.fn.sexyElement = function() {
// Запуск для всех инициализаций на странице.
$(this).each(function() {
var element = $(this);
// RADIO
else if (element.is(':radio')) {
// Для всех существующих радио кнопок.
element.each(function() {
// Создание и обработка радио кнопок.
var createRadio = function(){
var sexyRadio = '<div class="radio" title="' + element.attr('title') + '">'
<div class="dot">'
</div>'
</div>';
element.before(sexyRadio);
}
// Запуск функции.
createRadio();
});
// Определяем основные элементы.
var commonParent = element.parents().eq(0),
buttons = commonParent.find(':radio');
// Обработка щелчка мыши.
$('.radio').click(function() {
$(this).addClass('checked').siblings().removeClass('checked');
buttons.attr('checked', false);
$(this).next(':radio').attr('checked', true);
buttons.change();
});
}
// END RADIO
// В противном случае.
else {
alert('Пожайлуста убедитесь, что выбранный вами элемент является select или radio');
return false;
}
});
}
})(jQuery);
启动插件:
$(document).ready(function() {
$(':radio').sexyElement();
});
PS:对不起,有些标题是俄语。标签JS代码还没有写
我真的不知道为什么,但是这个bug是通过把输入单选按钮到他的标签来解决的。
:
<fieldset class="userAge">
<div class="fieldName">
Возраст:
</div>
<div class="overflow">
<input type="radio" name="userAge" id="seventeen" title="Выберите если вы младше 17" required>
<label for="seventeen">17 и младше</label>
<input type="radio" name="userAge" id="eighteen" title="Выберите если вы старше 18" required>
<label for="eighteen">18 и старше</label>
</div>
</fieldset>
:
<fieldset class="userAge">
<div class="fieldName">
Возраст:
</div>
<div class="overflow">
<label for="seventeen">
<input type="radio" name="userAge" id="seventeen" title="Выберите если вы младше 17" required>
17 и младше
</label>
<label for="eighteen">
<input type="radio" name="userAge" id="eighteen" title="Выберите если вы старше 18" required>
18 и старше
</label>
</div>
</fieldset>
不管怎样,知道为什么吗?
相关文章:
- 构建淘汰模型并动态查看,不设置单选按钮
- 根据选中的按钮运行不同的计算时,设置单选按钮
- 如何使用 AngularJS 在页面加载时通过查询字符串值来设置单选按钮值
- 流星:如何根据数据库中的值设置单选按钮的值
- 引导设置单选按钮与 jquery 一起检查
- JavaScript:取消选择时设置单选按钮的背景(单选按钮组)
- 仅在一个表格行内设置单选按钮标签的样式
- 未从视图模型(KNOCKOUTJS)设置单选按钮
- 设置单选按钮,无需交互,仅使用javascript
- 如何使用JavaScript设置单选按钮状态
- 设置单选按钮单击两个目的地(提交表单和重定向)
- 如何使用单选按钮的值来设置单选按钮
- 如何设置单选按钮列表与后缀文本后的单选图标
- 设置单选按钮的值在并排问题的质量-打破了JFE,但在标准工作
- 如何以编程方式设置单选按钮和选择选项与js
- 在javascript中设置单选按钮值
- 设置单选按钮值等于特定表行的文本
- AngularJS通过嵌套的id属性来设置单选按钮数组的默认值
- 如何在react material-ui中编程设置单选按钮选择
- 通过文本框值设置单选按钮为true