jQuery MiniUI

标题: mini-contextmenu页面中如果包含iframe即无效 [打印本页]

作者: weng_gh 时间: 2012-12-22 22:59:56 标题: mini-contextmenu页面中如果包含iframe即无效

<!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>
<title>ContextMenu Tree右键菜单</title>
<meta http-equiv="content-type" content="text/html; charset=UTF-8" /><link href="../demo.css" rel="stylesheet" type="text/css" />

<script src="../../scripts/boot.js" type="text/javascript"></script>

</head>
<body>
<h1>ContextMenu Tree右键菜单</h1>
<ul id="tree1" class="mini-tree" url="../data/listTree.txt" style="width:200px;padding:5px;"
      showTreeIcon="true" textField="text" idField="id" parentField="pid" resultAsTree="false"
      contextMenu="#treeMenu"
      >
</ul>

<ul id="treeMenu" class="mini-contextmenu" >
<li iconCls="icon-move">移动节点</li>
<li class="separator"></li>
<li>
  <span iconCls="icon-add">新增节点</span>
  <ul>
   <li>插入节点前</li>
         <li>插入节点后</li>
<li>插入子节点</li>
  </ul>
</li>
<li name="edit" iconCls="icon-edit">编辑节点</li>
<li name="remove" iconCls="icon-remove">删除节点</li>
</ul>
<div style="padding-top:5px;color:red;">Note：
      <ol>
         <li>禁止右键菜单：Base节点不显示右键菜单</li>
         <li>隐藏菜单项：Forms节点，隐藏"删除节点"菜单项</li>
         <li>禁用菜单项：Lists节点，禁用"编辑节点"菜单项</li>
      </ol>
</div>
      <iframe width="100%" height="100%" frameborder="1"  id="fileFrame" name="fileFrame" marginwidth="0" marginheight="0"/>
<script type="text/javascript">
      function onAddBefore(e) {
         var tree = mini.get("tree1");
         var node = tree.getSelectedNode();
         var newNode = {};
         tree.addNode(newNode, "before", node);
      }
      function onAddAfter(e) {
         var tree = mini.get("tree1");
         var node = tree.getSelectedNode();
         var newNode = {};
         tree.addNode(newNode, "after", node);
      }
      function onAddNode(e) {
         var tree = mini.get("tree1");
         var node = tree.getSelectedNode();
         var newNode = {};
         tree.addNode(newNode, "add", node);
      }
      function onEditNode(e) {
         var tree = mini.get("tree1");
         var node = tree.getSelectedNode();

         tree.beginEdit(node);
      }
      function onRemoveNode(e) {
         var tree = mini.get("tree1");
         var node = tree.getSelectedNode();
         if (node) {
            if (confirm("确定删除选中节点?")) {
                  tree.removeNode(node);
            }
         }
      }
      function onMoveNode(e) {
         var tree = mini.get("tree1");
         var node = tree.getSelectedNode();
         alert("moveNode");
      }
function onBeforeOpen(e) {
var menu = e.sender;
var tree = mini.get("tree1");
var node = tree.getSelectedNode();
if (!node) {
      e.cancel = true;
      return;
}
if (node && node.text == "Base") {
      e.cancel = true;
      //阻止浏览器默认右键菜单
      e.htmlEvent.preventDefault();
      return;
}
////////////////////////////////
var editItem = mini.getbyName("edit", menu);
var removeItem = mini.getbyName("remove", menu);
editItem.show();
removeItem.enable();
if (node.id == "forms") {
      editItem.hide();
}
if (node.id == "lists") {
      removeItem.disable();
}
}
</script>
<div class="description">
      <h3>Description</h3>
      <p>
      </p>
</div>
</body>
</html>

作者: niko 时间: 2012-12-23 10:05:32

你指的无效是什么。
可以正常在tree上显示右键菜单啊。

作者: weng_gh 时间: 2012-12-23 18:59:53

niko 发表于 2012-12-23 10:05
你指的无效是什么。
可以正常在tree上显示右键菜单啊。

奇怪啊。我这边把这段代码拿过来试，有iframe就没有右键菜单，拿掉iframe就正常。试了很多遍了

作者: weng_gh 时间: 2012-12-23 19:03:51

niko 发表于 2012-12-23 10:05
你指的无效是什么。
可以正常在tree上显示右键菜单啊。

你可以在官方示例上找到http://www.miniui.com/demo/#src=tree/contextmenu.html。在里面加入<iframe width="100%" height="100%" frameborder="1" id="fileFrame" name="fileFrame" marginwidth="0" marginheight="0"/>
再运行代码就不好使

作者: factory 时间: 2012-12-24 09:18:32

weng_gh 发表于 2012-12-23 19:03
你可以在官方示例上找到http://www.miniui.com/demo/#src=tree/contextmenu.html。在里面加入
再运行代码 ...

iframe结尾没写好
<iframe width="100%" height="100%" frameborder="1" id="fileFrame" name="fileFrame" marginwidth="0" marginheight="0"></iframe>
换成这样就可以了

欢迎光临 jQuery MiniUI (http://miniui.com/discuss/)