单击复选框后修改输入文本框的值

时间:2014-05-22 11:04:39

标签: javascript jquery

我有一个函数,我读取文本输入值并更新另一个div中显示的计数器。在某些情况下,我会显示一个复选框以及文本输入字段。在用户选中复选框时,在文本输入字段中输入的金额加倍,并且结果正确显示在计数器中。

当用户选中复选框时,我想尝试获取id,输入字段应与计数器一起加倍。

betslip中的文本输入是动态添加的。因此,视图中可能会有更多带有复选框的单个betlsips。

这是我的代码(HTML视图是通过JS动态生成的)

BetSlip.prototype.createSingleBetDiv = function(divId, Bet, winPlaceEnabled) {

    document.betSlip.setSingleCount($('[name=singleBet]').length);
    var id = divId.replace('_div','');

    // If such bet already exists
    if (!document.betSlip.singleDivExists(divId) && document.betSlip.getSingleCount() < maxNumberInBetslipRacing) {
        var singleBetPosition = (Bet.position == null) ? '' : Bet.position;

        var raceInfo = Bet.categoryName + ', ' + raceFullName + '&nbsp;' + Bet.name + ',&nbsp;' + Bet.betTypeName + ' (' + Bet.value.toFixed(2) + ')';

        var div = $('<div name="singleBet" class="bet gray2" id="' + divId + '"/>')
            // Appending div with data
            .data('Bet', Bet)

        // Appending error element
        $(div).append($('<p id="' + divId + '_error" style="display:none;"/>')
                .addClass('alert alert-danger alert-dismissable'))

        // Appending info element
        $(div).append($('<p id="' + divId + '_info" style="display:none;"/>')
            .addClass('alert alert-success alert-dismissable'))

        var bgDiv = $('<div id="bgDiv"/>').appendTo(div)

        // Append left part
        var productName = (Bet.productName != null) ? getBrandBetName(Bet.productName) : Bet.betTypeName;
        var leftDiv = $('<div class="left"/>')
            .appendTo(div)
            // Info abt the bet
            .append($('<p class="title"><b>' + singleBetPosition + '&nbsp;' + Bet.horseName + '</b><span style="float:right">' + productName + '</span></p>'))
            .append($('<p class="title">' + raceInfo + '</p>'))
            .append($('<p/>')
                .addClass('supermid')
                // Creating input field
                .append($('<input type="text" id="' + id + '_input"/>')
                    .keypress(function(event) {validateInputs(event, 'decimal')})
                    .keyup(function() {document.betSlip.updateSinglesTotalPrice()})))

        // Creating WIN / PLACE checkbox selection
        if (winPlaceEnabled) {
            $(leftDiv).append($('<p><input name="winPlaceCheckBox" id="' + id + '_checkbox\" type="checkbox"><b>' + winPlace + '</b></p>')
                .click(function() {document.betSlip.updateSinglesTotalPrice()}))
        }

        // Append Done and Reuse btns
        $(leftDiv).append($('<a id="reuseBtn" class="button confirm gray reuse" style="display: none;"/>').html(reuse).click(function() {document.betSlip.reuseBet(divId)}))
        $(leftDiv).append($('<a id="doneBtn" class="button confirm red donebtn" style="display: none"/>').html(done)
            .click(function(){$('#' + divId).find('a.right.orange').click()}))

        // Append right part
        $(div).append($('<a class="right orange"/>')
            .click(function() {
                document.betSlip.removeSingleBetDiv(divId);
            })
            // Closing btn
            .append($('<div class="icon_shut_bet"/>')))

        // Add div to the bet slip map
        document.betSlip.addSingleDiv(divId, div);

        return div;
    }
    else {
        if(this.getSingleCount() < maxNumberInBetslipRacing){
            $("#betSlipError").show();
            $("#betSlipError").html(sameBet);
            return null;
        }
        else{
            $("#betSlipError").show();
            $("#betSlipError").html(maxBet);
            return null;
        }
    }
}

在获胜/位置复选框中,我正在调用一个功能,该功能负责更新计数器中的最终价格(总投注)。我想在输入文本字段中更新相同的内容(加倍输入值)。如果取消选中复选框,则输入量应为一半(在输入字段和计数器中)。

更新总赌注值的功能

BetSlip.prototype.updateSinglesTotalPrice = function() {
    var totalBet = 0;

    $('[name=singleBet]').each(function() {

        var inputValue = $(this).find('input:text').val();
        // Win / Place
        if (document.betSlip.checkWinPlace(this)) totalBet += Number(inputValue * 2);
        // Win or Place
        else totalBet += Number(inputValue);
    });
    $("#betSinglesTotalBet").html(replaceParams(totBetPrice, [totalBet.toFixed(2), document.betSlip.getCurrency()]));
}

0 个答案:

没有答案