0

当用户在第一组的单选按钮中选择任何选项，然后在相应的输入字段中输入任何数字，然后选择下一个任何单选选项并在输入字段中输入任何值时，这一次它应该用旧的结果添加新结果并显示它在结果输入字段中，现在如果他清空任何输入字段，那么这也应该从总结果中减去并将其显示在结果字段中。

我有很多这样的组，但在这里我只放了两个来得到结果。

这里是FIDDLE

这是jquery代码。我可以在 jquery 中工作，但不是很好我为每个组使用单独的代码，我知道必须有一种方法可以通过通用代码获得整个功能，但我又不擅长 jquery

 jQuery("#txt_im").keyup(setValue);
 jQuery('[name="rdbtn-im"]').change(setValue);

function setValue() {
var txt_value = jQuery("#txt_im").val();
var rad_val = jQuery('[name="rdbtn-im"]:checked').val();
if(!txt_value.length) {
    jQuery('#final_res').val('');
    return;        
}

if (!rad_val.length) return;
var res = txt_value * rad_val;
var final = parseInt(res, 10);
var MBresult = final / 1024;


jQuery('#final_res').val(MBresult.toFixed(2));

}

var final2 = 0;

jQuery("#txt_fb").keyup(setValue2); 
jQuery('[name="rdbtn-fb"]').change(setValue2);

function setValue2() {


var txt_value = jQuery("#txt_fb").val();

var rad_val = jQuery('[name="rdbtn-fb"]:checked').val();
 if(!txt_value.length) {
    jQuery('#final_res').val('');
     return;   
 }

if (!rad_val.length) return;
var res2 = txt_value * rad_val;
final2 = parseInt(res2, 10) + final;
var MBresult = final2 / 1024;
jQuery('#final_res').val(MBresult.toFixed(2));


}

事实上，用户可以自由选择任意数量的组，也可以在选择后自由删除任意数量的组。

我知道当用户在选择第一个后选择第二组时小提琴中存在错误，它删除了错误的结果，我试图解决它但失败了，但我定义了我需要做的整体。我会非常感谢你的这种好意。

4

2 回答 2

2

HTML：

<table>
    <tr>
        <td>
            <input type="radio" name="rdbtn-im" id="rdbtn-im-day" value="25" class="rdbtn-style-social" />Daily&nbsp;
            <input type="radio" name="rdbtn-im" id="rdbtn-im-week" value="175" class="rdbtn-style-social" />Weekly
            <input type="text" name="txb3" id="txt_im" class="txt-email" style="width:100px;margin: 2px;" />
        </td>
    </tr>
    <tr>
        <td class="sec-td-rdbtns-social">
            <input type="radio" name="rdbtn-fb" id="rdbtn-fb-day" value="3500" class="rdbtn-style-social" />Daily&nbsp;
            <input type="radio" name="rdbtn-fb" id="rdbtn-fb-week" value="500" class="rdbtn-style-social" />Weekly
            <input type="text" name="txb1" id="txt_fb" class="txt-email" style="width:100px;margin: 2px;" />&nbsp;</td>
    </tr>
</table>
<br>result
<input type="text" name="final_res" id="final_res" class="" style="width:100px;margin: 2px;" />

查询：

jQuery(".txt-email").keyup(setValue);
jQuery('.rdbtn-style-social').change(setValue);

function setValue() {
    var total = 0;
    $(".rdbtn-style-social:checked").each(function () {
        var myInput = $(this).siblings(".txt-email").val();
        if (myInput.length) {
            total += myInput * $(this).val();
        }
    });
    if (total) {
        jQuery('#final_res').val((total / 1024).toFixed(2));
    } else {
        jQuery('#final_res').val('');
    }
}

小提琴

于 2013-06-26T16:17:05.420 回答
0

如果您使用的是 chrome，那么控制台是您最好的朋友（https://developers.google.com/chrome-developer-tools/docs/console）对于 Firefox，您有 firebug，opera 有蜻蜓（或类似的东西？）。甚至IE现在也有控制台。在那里你可以看到所有的错误弹出。

好的，首先让我们通过将其全部包装在闭包中来稍微清理一下（即使外部存在命名空间冲突，我们现在也可以安全地使用 $ 而不是 jQuery）。此外，我们将在这两种情况下使用单个函数，因为它们非常相似。

!function ($) {
    $(".txt-email").keyup(setValue);
    $('.rdbtn-style-social').change(function(e) { setValue(e, true) });

    function setValue(e, radio) {
        if('undefined' === typeof radio) radio = false;
        var attr = radio ? 'name' : 'id';
        var tmp = e.target[attr].split('-');
        var media = tmp[tmp.length - 1];

        var txt_value = $("#txt-"+media).val();
        var rad_val = $('.rdbtn-style-social[name="rdbtn-'+media+'"]:checked').val();
        if (!txt_value.length || !rad_val.length) {
            $('#final_res').val('');
            return false;
        }
        var res = (txt_value | 0) * rad_val;
        var final = parseInt(res, 10);
        var MBresult = final / 1024;
        $('#final_res').val(MBresult.toFixed(2));

    }
}(jQuery);

（变量 | 0 与 parseInt(variable, 10) 相同）。所以，长话短说：当收音机或文本改变时，函数被触发（如果是收音机，则传递额外的参数）。我们检索是否要在 im 或 fb 上工作，然后做任何你想做的事情。我更改了输入的 id 以将 _ 替换为 -'s（为了拆分一致性）

最后的jsfiddle：http: //jsfiddle.net/Misiur/f6cxA/1/

于 2013-06-26T16:12:08.897 回答