防止在 jquery-knob 上手动输入

Question

我使用 Jquery-Knob 作为控制旋钮从数组中选择值，我使用输入作为数组的索引，并将其他信息显示为标签。

    $(".dial").knob({
        displayPrevious : true,
        'min':0,
        'max': this.arrayList.length -1,
        'format' : (knobText)=>{
            if( isNaN(knobText) ){
                return knobText;
            }
            return this.arrayList[knobText].name;
        },
        'change' : (knobValue)=>{
            // Get the new user index
            console.dir("currentKnobIndex: " + Math.floor(knobValue));
            this.currentKnobIndex = Math.floor(knobValue);
        }
    });

我工作得很好，除非我单击旋钮标签并获得焦点以手动写入值。有没有办法防止这种情况？用户应该能够通过鼠标/触摸来更改值。我尝试添加“只读”，但它禁用完成旋钮。

Answer 1

通过向输入元素添加“只读”属性，您可以通过标签阻止可编辑选项。查看以下演示：

Demo