使用html5+canvas+Jquery实现的纯代码连线题

所属分类:其他-杂项

 44349  366  查看评论 (17)
分享到微信朋友圈
X
使用html5+canvas+Jquery实现的纯代码连线题 ie兼容9

分享一份使用html5+canvas实现的草稿版连线题demo,希望有助于奋斗在一线前端的开发人员们,也多多提供一些改良意见及多一份包涵。

首先功能点涉及重置、回退、取值(getPair)、答案(savePair)等四个按钮操作。

1、重置按钮,顾名思义为清除所以操作动作,清空画板的功能;

2、回退按钮,即返回上一步的意思,直至清空所有作答为止;

3、取值(getPair),案例截图如下:

返回属性格式及内置属性key-value可自定义:

var idAttr = [];
idStr = "key : value";
idAttr.push(idStr);
alert(idAttr);


相关插件-杂项

注册分步骤表单

注册分步骤表单
  杂项
 60110  621

jQuery步骤条进度条插件setStep.js

一款简单额步骤条,可点击 也可按钮控制。
  杂项
 53884  377

vue.js实现增删改查(原创)

bootstrap布局,vue.js实现增删改查功能,模态框新增与编辑
  杂项
 36223  398

超强PDF在线预览插件

该插件利用HTM5技术实现了对PDF文件的在线预览功能
  杂项
 241617  682

讨论这个项目(17)回答他人问题或分享插件使用方法奖励jQ币 评论用户自律公约

    诺许罡成 0
    2020/5/13 10:53:09
    实现移动端,怎么实现那
    回复
    ??没想到 0
    2019/6/27 19:09:02
    怎么在手机上实现点击两点连线
        ? ㄅ思_ò`? 0
        2019/7/17 10:32:43
        请问您在移动端实现了吗
    回复
    Kallima Inachus 0
    2018/11/7 9:29:00
    为什么实现不了移动端? 回复
    -上帝是苹果 0
    2018/7/25 10:20:38
    可以兼容ie6.7.8吗 回复
    神戴戴 0
    2018/5/28 16:06:24
    各位大神,请问一下,【连接线】两边的元素怎么记住并传递给服务端,要记住这种匹配关系,再次选择此匹配规则时,会直接自动呈现用线连接 回复
    hzz1995 0
    2018/4/18 17:37:43
    这个效果已经非常好了,但是如果作者或者更多的牛人将多对一,一对多的需求设置成代码的方式动态设置感觉就是一个更加完美的插件了。 回复
    Always online 0
    2018/1/26 11:22:07

    请问有人解决多对多的问题了吗

        love凝づ眸╃0
        2018/4/3 17:17:50
        同样的问题,还有就是能把这些换成tree吗
    回复
    骑着蜗牛的猪 0
    2018/1/4 10:40:12

    怎么一对多?怎么删除划线???

    回复
    释然 0
    2017/12/11 19:10:17
    可以针对某个元素进行删除直线吗?
        junyi5d0
        2019/4/28 17:41:11
        有个回退按钮
    回复
    で ね☆花舞う葬.・°? 0
    2017/11/2 14:37:21

    如何实现多对多的连线

    回复
😃
  • 😀
  • 😉
  • 😥
  • 😵
  • 😫
  • 😘
  • 😡
  • 👍
  • 🌹
  • 👏
  • 🍺
  • 🍉
  • 🌙
  • 💖
  • 💔
😃
  • 😀
  • 😉
  • 😥
  • 😵
  • 😫
  • 😘
  • 😡
  • 👍
  • 🌹
  • 👏
  • 🍺
  • 🍉
  • 🌙
  • 💖
  • 💔
取消回复