Javascript 下拉菜单在使用fabric js的物化设计中不起作用

我正在使用materialize design和fabric js库。我想更改画布中文本的字体样式。在具体化设计之前，我使用了bootstrap，然后它工作得很好。但现在我正在使用引导的materialize design place，然后我的下拉菜单不起作用

无物化设计（下拉菜单起作用）。

var canvas=newfabric.canvas（'canvas'）；
$（'#font'）。更改（函数（）{
var obj=canvas.getActiveObject（）；
如果（obj）{
obj.setFontFamily（$（this.val（））；
}
canvas.renderAll（）；
});
函数addText（）{
var oText=new fabric.IText（'Tap and Type'，{
左:100,，
前100名，
});
canvas.add（oText）；
setActiveObject（oText）；
$（'fill，'font'）。触发器（'change'）；
oText.bringToFront（）；
}

添加自定义文本
arial
塔荷马
新罗马时代

您必须使用materialize初始化选择框

$(document).ready(function() {
    $('#font').material_select();
  }); 

$（文档）.ready（函数（）{
$（'#font'）。材质选择（）；
});
var canvas=newfabric.canvas（'canvas'）；
$（'#font'）。更改（函数（）{
var obj=canvas.getActiveObject（）；
如果（obj）{
obj.setFontFamily（$（this.val（））；
}
canvas.renderAll（）；
});
函数addText（）{
var oText=new fabric.IText（'Tap and Type'，{
左:100,，
前100名，
});
canvas.add（oText）；
setActiveObject（oText）；
$（'fill，'font'）。触发器（'change'）；
oText.bringToFront（）；
}

添加自定义文本
arial
塔荷马
新罗马时代