JsPlumb 基本使用方法( JsPlumb & JQ ContextMenu & JQ Dialog)

最新推荐文章于 2024-04-17 11:58:14 发布

yinxianluo

最新推荐文章于 2024-04-17 11:58:14 发布

阅读量3.4k

点赞数 1

分类专栏： JAVA开发文章标签： js

本文链接：https://blog.csdn.net/yinxianluo/article/details/47057107

版权

这篇博客介绍了在使用JsPlumb和jQuery时遇到的问题，如contextmenu在dialog上无法正常显示，以及JsPlumb在不同浏览器中动态生成元素的ID差异。此外，还讨论了如何在JsPlumb的connector上添加contextmenu的挑战，并提供了Google演示页面的链接以供参考。

摘要由CSDN通过智能技术生成

1. JQ contextmenu 在JQ dialog 上面由于index 问题导致 contextmenu 显示不出来

2. JsPlumb 在IE 上动态生成 oval 标签并不生成ID,在 FF Chrome上动态生成 canvas 标签并生成随机ID, 这就导致不能通过ID来获取这个控件, 在jsplumb.js中唯一固定的是 class name , 并且 jsplumb 提供 click,dbclick 两个

3.暂时还没有办法动态的给connector 添加 contextmenu (由于connector 是动态生成的,用户手动控制EndPoint 时生成connector,并且会调用jsPlub的setConnector 方法生成 JsPlumb Connector)

Google 演示页面参考:http://jsplumb.org/jquery/draggableConnectorsDemo.html

File Source below:

<%@ Page Language="C#" Inherits="System.Web.Mvc.ViewPage" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>
    <script src="../../Scripts/jquery-1.4.4.min.js"></script>
    <script src="../../Scripts/jquery-ui.min.js"></script>
    <script src="../../Scripts/jquery.contextmenu.r2.packed.js"></script>
    <script src="../../Scripts/jquery.jsPlumb-1.3.2-all-min.js"></script>
    <style>
        ._jsPlumb_endpoint
        {
            z-index: 50;
            cursor: move;
        }

        .window
        {
            border: 1px solid #346789;
            -moz-border-radius: 0.5em;
            border-radius: 0.5em;
            opacity: 0.8;
            filter: alpha(opacity=80);
            width: 5em;
            height: 5em;
            line-height: 5em;
            text-align: center;
            z-index: 20;
            position: absolute;
            background-color: #eeeeef;
            color: black;
            font-family: helvetica;
            padding: 0.5em;
            font-size: 0.9em;
        }
        .window:hover
        {
            box-shadow: 2px 2px 19px #444;
            -o-box-shadow: 2px 2px 19px #444;
            -webkit-box-shadow

最低0.47元/天解锁文章

yinxianluo

关注

1
点赞
踩
1

收藏

觉得还不错? 一键收藏
0
评论
JsPlumb 基本使用方法( JsPlumb & JQ ContextMenu & JQ Dialog)

1. JQ contextmenu 在JQ dialog 上面由于index 问题导致 contextmenu 显示不出来2. JsPlumb 在IE 上动态生成 oval 标签并不生成ID,在 FF Chrome上动态生成 canvas 标签并生成随机ID, 这就导致不能通过ID来获取这个控件, 在jsplumb.js中唯一固定的是 class name , 并且 jsp
复制链接

扫一扫