可以道场访问与HTML元素事件的产生密切相关的功能？(Can dojo Access the fun

我想在骑一元素时屏幕处于“编辑”模式onclick事件相关联的功能。然后做编辑时，把原来的功能了。

所以，本来我有以下几点：

<script type="text/javascript">
    var showAddNewForum = function(){
        dojo.byId("NewForum").className = dojo.byId("NewForum").className == 'hidden'?'':'hidden';
    }
</script>
<a  onclick="showAddNewForum()" class="editable" id="AddNewForum" name="AddNewForum" style="cursor:pointer;">New Forum</a>
        <div class="hidden" id="NewForum" name="NewForum">
            <form action="">
                <table>
                    <tr><td><label>Title</label></td><td><input type="text" id="newForumTitle"/></td></tr>
                    <tr><td><label>Description</label></td><td><input type="text" id="newForumDescription"/></td></tr>
                    <tr><td><label>Moderators</label></td><td><input type="text" id="newForumnModerators"/></td></tr>
                </table>
                <input type="button" value="submit"/>
            </form>
        </div>

在页面的顶部有一个管理员按钮，将放在页面的配置模式。一类可编辑的所有元素将在配置模式，从而该元件可以通过一个小的形式配置。我们的想法是在屏幕上某些控件会根据用户角色不同的行为。例如：如果管理员展示它的其他明智的不显示控制。

这是通过以下实现：

    activateAdministration = function() {
        if (editOnClickHandle.length>0) {
            dojo.forEach(editOnClickHandle,function(item){dojo.disconnect(item)});
            editOnClickHandle = [];
        }else {
            dojo.query(".editable").forEach(function(node,idx,arr){
                var handler = dojo.connect(node,"onclick",function(e){
                    console.debug(node.onclick);
                    var adminWindow = document.getElementById("adminWindow");
                    adminWindow.className = "displayInline";
                    adminWindow.style.top = (e.layerY + 0) + "px";
                    adminWindow.style.left = (e.layerX + 0) + "px";
                    document.getElementById("adminElementId").value = node.id;
                    document.getElementById("adminCurrentUrl").value = location.href;
                    document.getElementById("adminClass").value = node.className;
                });
                editOnClickHandle.push(handler);
            });
        }
    }
<a class="tool" style="cursor:pointer;" onclick="activateAdministration();">Admin</a>

所以，问题是原始的onclick功能仍连接到该事件。如果它是一个提交功能，或者类似的东西，那么它也将火这是不期望。

我可以设置一个处理程序原有的功能，它dissconnect，添加新的功能，然后完成编辑删除新的功能，并添加了原一回当？

感谢您的任何提示，我希望这个问题是清楚的（可能不是）高兴，如果需要添加更多的信息。

Answer 1:

我会实现这个问题的方法是始终覆盖的onclick处理程序在页面上所有可编辑的对象与处理程序，要么干脆委托调用原始的或者叫做管理的版本。

你可以这样使用在道场很容易的，就像这样：

  admin_mode = false;
  activateAdministration = function() {
    admin_mode = true;
  };

  editClick = function(e) {
    console.debug("..in admin edit function; this=%o; e=%o", this, e);
    // do your admin stuff here
    // var node = this;
  };

  dojo.query('.editable').forEach(function(node) {

    if (node.onclick) {
      var original_onclick = node.onclick;
      node.onclick = function() {
        if (admin_mode) {
          console.debug("calling admin onclick handler");
          editClick.apply(node, arguments);
        } else {
          // delegate
          console.debug("calling original onclick handler");
          original_onclick.apply(node, arguments);
        }
      }
    }

  });

我与HTML测试它是这样的：

<a onclick="console.debug('I am the original!; this=%o; args=%o', this, arguments);" 
   class="editable"> 
  EDITABLE 
</a>

<a onclick="console.debug('Me too!; this=%o; args=%o', this, arguments);" 
   class="editable"> 
  ALSO EDITABLE 
</a>

Answer 2:

你控制的showAddNewForum（）函数的代码和它插入到HTML？在这种情况下，我可能只使用一个处理器，是这样的：

dojo.connect(dojo.byId("AddNewForum"), "onclick", function(evt) {
    if (dojo.hasClass(evt.target, "editable") {
        //do the editing work here
        doConfiguration(evt.target);
    } else {
        //do regular work here.
        doRegularAction(evt.target);
    }
});

如果不是这样，扶住把手连接和注销，当您更改页面配置模式寄存器是正确的。

Answer 3:

首先让我说我讨厌IE浏览器，尤其是IE6。这将是一个很好的一天的确，当我的公司终于移开IE6的。所以，我如何得到它周围是我设置叫oldclick到node.onclick属性，然后设置node.onclick =“”当我activateAdministration。在另一面我断开hadlers并添加oldclick回的onclick。

var editOnClickHandle = []; 
activateAdministration = function() {
        if (editOnClickHandle.length>0) {//turn off administration
            dojo.forEach(editOnClickHandle,function(item){dojo.disconnect(item)});
            dojo.query(".editable").forEach(function(node,idx,arr){
                if(dojo.isIE){
                    node.onclick=node.getAttribute("oldclick");
                }else{
                    node.onclick=dojo.hitch(node.onclick,node.getAttribute("oldclick"));
                }               
            });
            editOnClickHandle = [];
        }else {//turn on administration
            dojo.query(".editable").forEach(function(node,idx,arr){
                var onClickName = new String(node.getAttribute("onclick"));
                var oldClickName = onClickName.substring(0,onClickName.indexOf("("));
                if(dojo.isIE){
                    node.setAttribute("oldclick",node.onclick);
                }else{
                    node.setAttribute("oldclick",oldClickName);
                }
                node.onclick="";
                editOnClickHandle.push(dojo.connect(node,"onclick",editClick));
            });
        }
    }

不相关的这个问题，但为了清楚起见，我重构的小窗口管理代码移出到名为editClick一个seprate功能。看起来像：

editClick = function(e){
    console.debug(e);
    var adminWindow = document.getElementById("adminWindow");
    adminWindow.className = "displayInline";
    adminWindow.style.top = (e.layerY + 0) + "px";
    adminWindow.style.left = (e.layerX + 0) + "px";
    document.getElementById("adminElementId").value = e.target.id;
    document.getElementById("adminCurrentUrl").value = location.href;
    document.getElementById("adminClass").value = e.target.className;
}

因此，希望这将帮助别人的未来，感谢您的帮助jrburke。如果有人想挑开我的解决方案，我对游戏有建设性的意见。

文章来源: Can dojo Access the function assosiated with a HTML elements Event?