且构网

分享程序员开发的那些事...
且构网 - 分享程序员编程开发的那些事

如何在文本框中选择不同的单选按钮时传递不同的值

更新时间:2023-10-26 14:07:52

我只想和你分享一下。我制作了一个更清晰的标记版本,并使用jQuery使JS调用更紧凑,我也使用数据属性来设置每个输入需要乘以的值。

I just want to share this with you. I made a cleaner version of your markup and used jQuery to make JS calls more compact, also I used data-attributes to set the value that needs to be multiplied for each input.

这是Javascript:

Here's the Javascript:

$(document).ready(function(){
    $('#loads').closest('div').hide();

    $('input[name="myradio"]').change(function(){
        if($('input[name="myradio"]:checked').val() == '100')
            $('#loads').closest('div').hide();
        else
            $('#loads').closest('div').show();
    });

    $('#btn-calculate').click(function(){
        var units = parseInt( $('#units').val() );
        var radioVal = $('input[name="myradio"]:checked').val();
        $('input[readonly]').each(function(){
            var val = units * radioVal * ($(this).data('value') ? $(this).data('value') : 100);
            $(this).val(val);
        });
    });
});

此处完整演示

Full demo here