1

jQueryモバイルラジオを垂直に積み重ねられたラジオに動的に変換しようとしています。私はこれを持っています。

$('fieldset').data('type', 'vertical').controlgroup('refresh');

これにより、すべてのdata-type="horizo​​ntal"がdata-type="vertical"に変更されるべきではありませんか？調べても変化はありません。また、フォームでtrigger（'create'）を使用して遊んだことがありますが、これはラジオを台無しにするだけです。

<div data-role="fieldcontain">
    <fieldset data-role="controlgroup" data-type="horizontal">
        <input type="radio" name="gender" id="male" value="male" class="required" checked />
        <label for="male">Male</label>
        <input type="radio" name="gender" id="female" value="female" class="required" />
        <label for="female">Female</label>
    </fieldset>
</div>
4

1 に答える 1

4

私は通常、水平から垂直に、またはその逆に変更する必要があるときはいつでも、コントロールグループとラジオボタンに適用されるスタイルを変更するために使用します。以下はコードです、これがあなたの要件に合うことを願っています。

$("fieldset").attr('data-type','vertical').removeClass('ui-controlgroup-horizontal').addClass('ui-controlgroup-vertical');

var $firstLbl =  $("fieldset").find('div.ui-radio:first').children('label'),
    $secondLbl = $("fieldset").find('div.ui-radio:last').children('label');

    $firstLbl.removeClass('ui-corner-left').addClass('ui-corner-top');
    $firstLbl.children('span').removeClass('ui-corner-left').addClass('ui-corner-top');
    $secondLbl.removeClass('ui-corner-right').addClass('ui-corner-bottom');
    $secondLbl.children('span').removeClass('ui-corner-right').addClass('ui-corner-bottom');

    //show the radio buttons.
    $("input[type='radio']").each(function(i) {
        var $self = $(this);
        $self.next().addClass('ui-btn-icon-left').find('span.ui-btn-text').after($('<span class="ui-icon ui-icon-shadow ui-icon-radio-off">&nbsp;</span>'));
    });

    //Set the first one as checked by default.
    $("input[type='radio']:first").attr("checked",true).checkboxradio("refresh");
于 2013-03-26T03:35:39.567 に答える