Question

此功能（使用option:selected）更改<div class="item">0</div>的CSS和HTML以模拟某种进度条应用。问题是它超过100%。所以if语句不正确或者这里有什么问题？有线索吗？

$(function(){
    $('#selectChoice').change(function() {
        $('option:selected', this).each(function() {
            var id = $('#selectChoice option:selected').attr('id');
            $('#' + id + 'Item').css("color", "#f00").css("font-weight", "bold");
        });
    });

    $('#plus25').on('click', function() {
        var id = $('#selectChoice option:selected').attr('id');
        $('#' + id + 'Item').html(function(i, value) {
            var newWidth = parseInt(value * 1 + 25);
            var e = window.event;
            $('#' + id + 'Item').css('width', newWidth + '%');
            if (value <= 75){
                return newWidth;
            } else { 
                e.PreventDefault();}
            });
        });
    });

以下条件也在0

做了一些奇怪的事情

if (value >= 25) {
    return newWidth;
}

可以看到完整版here

Answer 1

您应该使用传递给event处理程序的click对象，而不是全局window.event。此外，该方法是小写的preventDefault()。试试这个：

$('#plus25').on('click', function(e) { // Note the 'e' parameter here
    var id = $('#selectChoice option:selected').attr('id');
    $('#' + id + 'Item').html(function(i, value) {
        var newWidth = parseInt(value * 1 + 25);
        $('#' + id + 'Item').css('width', newWidth + '%');
        if (value <= 75) {
            return newWidth;
        } else {
            e.preventDefault();
        }
    });
});

在if / else语句中，e.preventDefault（）未对条件执行100％

1 个答案: