如何解决无法通过下拉列表获取 select 标签的值
我已经使用 FabricJS 好几天了,我在获取下拉菜单的值时遇到了问题,因此我可以使用“单击”事件侦听器正确应用所需的形状。所以当我点击下拉菜单时并选择“矩形”并点击按钮,它应该生成一个矩形。这是我的代码:
HTML:
<p>Choose a Shape</p>
<select id="shapesId">
<option value="square">Square</option>
<option value="rectangle">Rectangle</option>
<option value="triangle">Triangle</option>
<option value="circle">Circle</option>
<option value="polygon">Polygon</option>
<option value="ellipse">Ellipse</option>
<option value="line">Line</option>
</select>
<button id="realShapes">Go!</button>
所以当我们点击“Go!”我想通过形状选项获得任何选择的价值。 现在这是我的 Javascript:
const shapes = document.getElementById("shapesId");
const e = shapes.value;
const clickShapes = document.getElementById("realShapes");
clickShapes.addEventListener("click",() => {
if(e === "Rectangle") {
const rect = new fabric.Rect({
left: 100,top: 100,fill: 'black',width: 70,height: 70,angle: 45
});
canvas.add(rect);
}
canvas.renderAll();
})
我现在很迷茫,一直在努力解决这个问题好几个小时,任何帮助将不胜感激。感谢阅读本文的人!
解决方法
尝试使用它来获取 shapesid 选择的值(将值存储到 xvalue):
-- The single representation for Haskell code
data HCode = HE Exp | HD Dec | HP Pat | HT Type
-- And common functions in tree traversal such as:
children :: HCode -> [HCode]
children (HE (VarE _)) = []
children (HE (AppTypeE e t)) = [HE e,HT t]
children c = ...
-- Ultimately a transform function similar to:
-- (Not really arguing about this exact model of tree transformation)
preorder :: (HCode -> HCode) -> HCode -> HCode
preorder f h =
let h' = f h
in rebuildWithChildren h' . fmap (preorder f) . children $ h'
附加信息(您可以使用以下内容作为可行的示例):
var xvalue = document.getElementById("shapesId").options[document.getElementById("shapesId").selectedIndex].value;
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。