1

我想在函数的代码的一部分中为 jquery 元素设置一个条件。这个想法是 input.other[type="checkbox"] 无法取消选中另一个复选框，但可以很好地执行其他操作。这是小提琴

HTML

<input type="checkbox" name="accs" icost="5000" class="arms" />Arm 1: $5000
<br/>
<input type="checkbox" name="accs" icost="6000" class="arms" />Arm 2: $6000
<br/>
<input type="checkbox" name="accs" icost="7000" class="neck" />Neck 1: $7000
<br/>
<input type="checkbox" name="accs" icost="8000" class="neck" />Neck 2: $8000
<br/>
<input type="checkbox" name="accs" icost="12000" class="other" />Other 1: $12000
<br />
<input type="checkbox" name="accs" icost="8000" class="other" />Other 2: $20000
<br />
<div id="total">$5000</div>

javascript代码：

var items = $('input.arms[type="checkbox"], input.neck[type="checkbox"], input.other[type="checkbox"]');
// get the initial total and store in a data for use later (resets as needed)
var total = $('#total');
total.data("currentvalue", parseFloat(total.text().replace(/[^0-9\,]+/g, "")));
items.change(function () {
var currenttotal = total.data("currentvalue");
//exlude input.other[type="checkbox"] from here
var myClass = $(this).attr('class');
var thisGroup = $('.' + myClass);
var notme = $('.' + myClass + ':checked').not(this);
var notmeCost = (notme.length ? notme.attr('icost') : ($(this).is(':checked') ? 0 :  $(this).attr('icost')));

notme.prop('checked', false);
//ends here
//include input.other[type="checkbox"] from here
currenttotal = currenttotal - notmeCost;
total.fadeOut(300);
thisGroup.filter(':checked').each(function (i) {
    var cost = $(this).attr('icost');
    currenttotal = currenttotal + parseFloat(cost);
});
total.data("currentvalue", currenttotal);
total.text("$" + currenttotal.formatMoney(0, ',', '.')); // fix your format here as needed
total.fadeIn(300);
});
4

2 回答 2

1

我会为那些你想像单选按钮集一样对待的人添加一个“likeRadio”类，然后管理它：

修改后的标记：（最后一项更改了值以匹配文本 - 如果它不同，您可以修复它）

<input type="checkbox" name="accs" icost="5000" class="arms likeRadio" />Arm 1: $5000
<br/>
<input type="checkbox" name="accs" icost="6000" class="arms likeRadio" />Arm 2: $6000
<br/>
<input type="checkbox" name="accs" icost="7000" class="neck likeRadio" />Neck 1: $7000
<br/>
<input type="checkbox" name="accs" icost="8000" class="neck likeRadio" />Neck 2: $8000
<br/>
<input type="checkbox" name="accs" icost="12000" class="other" />Other 1: $12000
<br />
<input type="checkbox" name="accs" icost="20000" class="other" />Other 2: $20000
<br />
<div id="total">$5000</div>

代码：这不是一个严格的依赖关系，如果你有多个类，第一个是你为单选按钮功能“分组”的那个。（见拆分功能）

Number.prototype.formatMoney = function (c, d, t) {
    c = isNaN(c = Math.abs(c)) ? 2 : c;
    d = d === undefined ? "." : d;
    t = t === undefined ? "," : t;
    var n = this,
        s = n < 0 ? "-" : "",
        i = parseInt(n = Math.abs(+n || 0).toFixed(c), 10) + "",
        j = (j = i.length) > 3 ? j % 3 : 0;
    return s + (j ? i.substr(0, j) + t : "") + i.substr(j).replace(/(\d{3})(?=\d)/g, "$1" + t) + (c ? d + Math.abs(n - i).toFixed(c).slice(2) : "");
};
// get the initial total and store in a data for use later (resets as needed)
var total = $('#total');
var originalValue = parseFloat(total.text().replace(/[^0-9\,]+/g, ""));
total.data("currentvalue", originalValue);
total.data("originalvalue", originalValue);

var items = $('input.arms[type="checkbox"], input.neck[type="checkbox"], input.other[type="checkbox"]');
items.change(function () {
    var currenttotal = total.data("originalvalue");
    var arrayOfClasses = $(this).attr('class').split(' ');
    var myClass = arrayOfClasses[0];
    var thisGroup = $('.' + myClass);
    if ($(this).hasClass('likeRadio')) {
        var notme = $('.' + myClass + ':checked').not(this);
        var notmeCost = (notme.length ? notme.attr('icost') : ($(this).is(':checked') ? 0 : $(this).attr('icost')));
        notme.prop('checked', false);
        currenttotal = total.data("currentvalue");
        currenttotal = currenttotal - notmeCost;
    } else {
        thisGroup = items;
    }
    total.fadeOut(300);
    thisGroup.filter(':checked').each(function (i) {
        var cost = $(this).attr('icost');
        currenttotal = currenttotal + parseFloat(cost);
    });
    total.data("currentvalue", currenttotal);
    total.text("$" + currenttotal.formatMoney(0, ',', '.')); // fix your format here as needed
    total.fadeIn(300);
});
于 2013-03-25T12:33:08.393 回答
1

我在 jsfiddle 中进行了更改： 

Number.prototype.formatMoney = function(c, d, t){
        var n = this, c = isNaN(c = Math.abs(c)) ? 2 : c, d = d == undefined ? "." : d, t = t == undefined ? "," : t, s = n < 0 ? "-" : "", i = parseInt(n = Math.abs(+n || 0).toFixed(c)) + "", j = (j = i.length) > 3 ? j % 3 : 0;
           return s + (j ? i.substr(0, j) + t : "") + i.substr(j).replace(/(\d{3})(?=\d)/g, "$1" + t) + (c ? d + Math.abs(n - i).toFixed(c).slice(2) : "");
         };

        var items = $('input.arms[type="checkbox"], input.neck[type="checkbox"], input.other[type="checkbox"]');
        // get the initial total and store in a data for use later (resets as needed)
        var total = $('#total');
        total.data("currentvalue", parseFloat(total.text().replace(/[^0-9\,]+/g, "")));
        items.change(function () {
            var currenttotal = total.data("currentvalue");
            var myClass = $(this).attr('class');
            if(myClass=='other')
            {
                  var notmeCost=$(this).attr('icost');

                  if($(this).is(':checked')==false)
                      notmeCost=0-parseFloat(notmeCost);
                 currenttotal = currenttotal + parseFloat(notmeCost);

      total.fadeOut(300);
            }
            else
            {
            var thisGroup = $('.' + myClass);
            var notme = $('.' + myClass + ':checked').not(this);
            var notmeCost = (notme.length ? notme.attr('icost') : ($(this).is(':checked') ? 0 : $(this).attr('icost')));

            notme.prop('checked', false);


            currenttotal = currenttotal - notmeCost;
            total.fadeOut(300);
            thisGroup.filter(':checked').each(function (i) {
                var cost = $(this).attr('icost');
                currenttotal = currenttotal + parseFloat(cost);
            });
            }

            total.data("currentvalue", currenttotal);
            total.text("$" + currenttotal.formatMoney(0, ',', '.')); // fix your format here as needed

        });

在这里，我认为您输入错误：

<input type="checkbox" name="accs" icost="8000" class="other" />Other 2: $20000;// icost is incorrect

将其更改为

<input type="checkbox" name="accs" icost="20000" class="other" />Other 2: $20000;
于 2013-03-25T05:52:28.187 回答