0

さまざまな理由から、以下のコードを変更して、「mygroup」というクラスではなくデータ属性を調べたいと考えています。

HTML

<select id="apply">
    <option value="email">Email</option>
    <option value="website">Website</option>
</select>
<input type="text" class="input" id="email" placeholder="test@test.com" data-id="application"/>
<input type="text" class="input" id="website" placeholder="www.example.com" data-id="application"/>
<textarea class="input" rows="4" cols="50" placeholder="text*" data-id="applicationdetails"></textarea>

JS

// Apply Fields
function applyField() {
    $(document).on('change', '#apply',function() {
        var selected = $(this).find(':selected').val(),
            elem = $("#"+selected);
        $(".mygroup").addClass('hidden');
        elem.removeClass('hidden');
    });
    $("#apply").trigger('change');
};

フィドル

クラス「mygroup」を使用するのではなく、「application」のデータ ID に適用される上記のコードを変更するにはどうすればよいですか。ボーナスポイントについて、非表示になっているフィールドの内容をクリアして無効にする方法を誰か教えてもらえますか?

4

2 に答える 2

4

単に として参照します$('[data-id="application"]')。

クリアと無効化については、 and を使用.prop()し.val('')ます。

$('[data-id="application"]').addClass('hidden').prop('disabled', true).val('');
elem.removeClass('hidden').prop('disabled', false);

デモ

于 2013-07-11T09:55:40.467 に答える