0

ユーザーが入力フィールドに値を入力すると、チェックボックスのクラス値が自動的に変更されます

入力フィールド:

 <input style="width:25px; margin-left:5px;" type="text" name="qtyA" id="qtyA"  />

チェックボックス: 

<input id="INsrv1" name="INopt" type="checkbox" value="1" />1<br>   
<input id="INsrv2" name="INopt" type="checkbox" value="2" />2<br>   
<input id="INsrv3" name="INopt" type="checkbox" value="3" />3<br>   
<input id="INsrv4" name="INopt" type="checkbox" value="4" />4<br>

JavaScript: 

<script>
$(document).ready(function() {
$('#qtyA').on('change', function() {
    var max = $(this).val();
 });

    $("[name$='INopt']").prop('class','validate[minCheckbox[1],maxCheckbox[max]] checkbox text')
    });
</script>

例：

ユーザーは入力フィールド「qtyA」に 3 を入力します

値: 3

スクリプトの maxCheckbox[] 値はそれに伴って変更されます

maxCheckbox[1] から maxCheckbox[3] まで

実際のコード:

  <script>
$(document).ready(function() {

 $('#qtyA').on('change', function() {
    var max = $(this).val();
    alert(max);
 });

$("#srv").on('change', function() {
    var max = $('#qtyA').val();
    alert(max);
    var selVal = $(this).val();
        if (selVal == 'Inbound') { // Inbound
            $('.Inbound').show();
            $('.Outbound').hide();
            $("[name$='OUTopt']").prop('class','')
            $("#OUTsrvOtr").prop('class','')

            $("[name$='INopt']").prop('class','validate[minCheckbox[1],maxCheckbox[max]] checkbox text')
            $('#valOUT').val('');
            $('div#Outbound').find('span').prop('class','');

        }
        else if (selVal == 'Outbound') { // Outbound
            $('.Inbound').hide();
            $('.Outbound').show();
            $("[name$='INopt']").prop('class','')
            $("#INsrvOtr").prop('class','')

            $("[name$='OUTopt']").prop('class','validate[minCheckbox[1],maxCheckbox[max]] checkbox text')
                $('#valIN').val('');
            $('div#Inbound').find('span').prop('class','');

        }
        else {
            $('.Inbound').hide();
            $('.Outbound').hide();
            $('#valOUT').val('');
            $('#valIN').val('');
            $("[name$='INopt']").prop('class','')
            $("#OUTsrvOtr").prop('class','')
            $('div#Inbound').find('span').prop('class','');

            $("[name$='OUTopt']").prop('class','')
            $("#OUTsrvOtr").prop('class','')
            $('div#Outbound').find('span').prop('class','');
        }
    });
});
</script>
4

1 に答える 1

1 
$(document).ready(function() {
$("input").onchange(function() {
    $(this).attr('class','validate[minCheckbox[1],maxCheckbox[1]] checkbox text')
}
});
于 2012-10-01T04:20:20.057 に答える