input type=radio
私は、html 内のすべてを検索し、それらに派手な css を追加する jQuery スクリプトを持っています。問題は、いくつかのラジオボタンをそのままにしておきたいということです。jQuery は次のとおりです。
$(this).each(function (i) {
if ($(this).is('[type=checkbox],[type=radio]')) {
var input = $(this);
var label = $('label[for=' + input.attr('id') + ']');
var inputType = (input.is('[type=checkbox]')) ? 'checkbox' : 'radio';
$('<div class="custom-' + inputType + '"></div>').insertBefore(input).append(input, label);
var allInputs = $('input[name=' + input.attr('name') + ']');
label.hover(
function () {
$(this).addClass('hover');
if (inputType == 'checkbox' && input.is(':checked')) {
$(this).addClass('checkedHover');
}
},
function () {
$(this).removeClass('hover checkedHover');
});
input.bind('updateState', function () {
if (input.is(':checked')) {
if (input.is(':radio')) {
allInputs.each(function () {
$('label[for=' + $(this).attr('id') + ']').removeClass('checked');
});
};
label.addClass('checked');
} else {
label.removeClass('checked checkedHover checkedFocus');
}
})
.trigger('updateState')
.click(function () {
$(this).trigger('updateState');
})
.focus(function () {
label.addClass('focus');
if (inputType == 'checkbox' && input.is(':checked')) {
$(this).addClass('checkedFocus');
}
})
.blur(function () {
label.removeClass('focus checkedFocus');
});
}
});
これは問題なく動作しますが、ページ上のすべてのラジオ ボタンが変更されます。そして、変更する必要があるいくつかのラジオボタンを追加したいと思います。この HTML コードのラジオ ボタンを上記のスクリプトで変更しないようにします。
<p class="field switch">
<input type="radio" id="radioZ1" name="field1" checked />
<input type="radio" id="radioZ2" name="field2" />
<label for="radioZ1" class="cb-enable selected"><span>Enable</span>
</label>
<label for="radioZ2" class="cb-disable"><span>Disable</span>
</label>
</p>
.not()
だから私は直後に追加しようとし.is()
ていましたが、運がありませんでした. 誰か助けてくれませんか?