我无法让jQuery旋钮显示值 [英] I can't get jQuery knob to display a value

问题描述

首先，在此先感谢您的任何建议.我到处都在寻找解决方案，却找不到任何东西.不可否认，JavaScript不是我的强项.

First, thanks in advance for any advice. I've looked everywhere for a solution and can't find anything. Admittedly, Javascript isn't my strong suit.

我正在使用fineuploader一对一地上传文件，并使用jQuery旋钮显示上传进度.该旋钮仅用于上传进度更新，并且不应是交互式的.我可以设置样式，设置旋钮的大小完成百分比，等等.但是我无法在中间显示上传百分比.

I'm using fineuploader to upload files, one-by-one and using jQuery knob to display the upload progress. The knob is for upload progress updates only and shouldn't be interactive. I can style it, set the size completion % of the knob, etc. but I cannot get it to display the upload % in the middle.

这是我的代码.

}).on('upload', function(event, id, name) {
    var progressField = $('#' + 'pic' + (id + 1)).parent();
    progressField = progressField.parent();
    var picName = $(progressField).children('label:first').html();
    $(progressField).attr("class", "uploaderBox");
    $(progressField).html('');
    $('.uploaderBox').html('<span class="picName">Uploading ' + picName + '...</span>');
    $(progressField).append('<div id="progressKnob"></div>');
    $("#progressKnob").knob({
                            "displayInput": true,
                            "thickness": .15,
                            "width": 70,
                            "fgColor": "#FF00FF",
                            "inputColor": "#000000"
                            });
}).on('progress', function(extra, id, name, uploadedBytes, totalBytes){
    var currentProgress = Math.round((uploadedBytes / totalBytes) * 100);
    $('#progressKnob')
        .val(currentProgress)
        .trigger('change');
}).on('complete', function(event, id, name, responseJSON){
    $('#progressKnob')
        .val(100)
        .trigger('change');

推荐答案

经过几天的修补，我解决了自己的问题.我只是以为我会将其发布在这里，以防其他人遇到与我相同的问题并需要答案.

After many days of tinkering, I solved my own problem. I just thought I'd post it here in case anybody else develops the same problem I did and needs the answer.

首先，我必须为自己的错误负责.我正在尝试将jQuery旋钮用于其他目的.我真的只希望它显示上传进度.我无意使用它来输入任何内容，因此我将其放在标准div中.除数字上载百分比外，它在div中的所有其他功能均正常运行.我无法在圆心中显示一个数字.

First, I have to take credit for my own mistake. I was attempting to use jQuery knob for a purpose other than the one it was intended for. I really only wanted it to display the progress of an upload. I had no intention of using it to input anything so I put it in a standard div. It worked fine in the div for everything other than the numeric upload percentage. I couldn't get it to display a number in the center of the circle.

问题在于它根本不打算放在div中.它不会接受输入"值，因为它不是输入字段.将.knob分配给输入字段后，所有内容都将排成一行.

The problem is that it wasn't intended to be in an div at all. It wouldn't accept an 'input' value because it wasn't an input field. Once I assigned the .knob to an input field everything fell right into line.

对于以后读这本书并大笑的任何人，我很高兴我逗乐了你.对于任何有帮助的人来说，那也很好.

For anybody that reads this later and laughs, I'm glad I amused you. For anybody that it helps, well, that's good too.

这篇关于我无法让jQuery旋钮显示值的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！