繁体   English   中英

jQuery函数.on()不适用于“click”事件

[英]jQuery function .on() doesn't work with “click” event

我正在使用MS Dynamics CRM 2013,我面临的问题是,当我想在导航窗格中的“Documents”按钮中添加事件处理程序时,

在此输入图像描述

jQuery函数.on()不适用于“click”事件。 它适用于“mouseover”或“mouseup”事件,但不适用于“click”。 这是我正在使用的代码:

$("#crmMasthead").on( "click", "#Node_navDocument", function(){ alert("Success!"); } );

Where:
#crmMasthead - static selector;
#Node_navDocument - id of the button "Documents", that I want to reload.

请帮我解决这个问题。 先感谢您!

编辑

这是我正在处理的HTML:

用户在CRM 2013中打开导航窗格之前:

<body>
...
    <div id="crmMasthead" tabindex="-1">
        <div class="navStatusArea" id="navStatusArea"></div>
        <div class='navBar' id='navBar'>...</div>       
        <div class="navBarOverlay" id="navBarOverlay" style="display: none;">     </div>
    </div>
...
</body>

用户刚刚在CRM 2013中打开了导航窗格:

<body scroll="no">
...
    <div id="crmMasthead" tabindex="-1">
        <div class="navStatusArea" id="navStatusArea"></div>
        <div class='navBar' id='navBar'></div>
Changed:<div class="navBarOverlay" id="navBarOverlay" style="display: block;"></div>
New:    <div class="navActionGroupContainer" style="">
            ...
            <a class="navActionButtonContainer navActionButton     navActionButtonDefault normal " id="Node_navDocument" role="button" title="Documents" href="javascript:;" unselectable="on" style="background-color: #555555">...</a>
            ...
        </div>

    </div>
...
</body>

不幸的是,函数.on()在我的情况下不适用于click事件,因为事件click #Node_navDocument元素已经绑定到另一个使用event.stopImmediatePropagation()系统函数,并且所有自定义逻辑都没有执行。

但是,还有另一种方式......

实现click事件自定义逻辑的主要目标是在此事件后显示具有不同src链接的系统iframe 因此,要解决此任务,我们需要做下一步:

在此输入图像描述

  • 为某些静态元素(1)创建处理程序,该元素应绑定元素(2)的onclick事件;
  • 在元素(2)的onclick事件上创建监听器,用于监视iframe是否存在。

元素(1)具有id #TabNode_tab0Tab ,element(2) - #Node_navDocument和iframe - #areaDocumentFrame

这是代码:

replaceDocumentsLink: function () {
    console.log("Function was started!");
    var listener = {};

    window.top.$("#TabNode_tab0Tab").on("mouseover", function () {
        if (window.top.$('#Node_navDocument').length)
            window.top.$('#Node_navDocument')[0].onclick = function () {
                listener = setInterval(function () {
                    if ($("#areaDocumentFrame").length) {
                        console.log("Frame was found!")
                        $("#areaDocumentFrame").attr("src", "http://www.microsoft.com/");                            
                        clearInterval(listener)
                    }
                    else
                        console.log("Frame was not found!")
                }, 250);
            }
    });  

尝试

jQuery(document).on('click', '#Node_navDocument', function() {
    alert("Success!");
});

要么

jQuery('#Node_navDocument').click(function() {
    alert("Success!");
});

正如这里所解释的那样,代表团就是这样,你做得很好。

正如您在本演示中所看到的,使用按钮模拟第二个div的加载,您的代码可以正常工作。

顺便说一下,也许你做过这样的事情:

    $("#crmMasthead").on('click', function() {
       $(this).append("<div id=\"Node_navDocument\"> B </div>");
    });

如果你使用append,当你点击“#Node_navDocument”时,可能会再次调用上面的代码而不是:

   $("#crmMasthead").on('click', "#Node_navDocument", function() {
          .......
   });

编辑

尝试检查元素的z-index。 也许你的div之上还有别的东西。
这个其他演示也许可以帮到你。

发布html后编辑2

请注意,您绑定了一个标签(ID为Node_navDocument)。 顺便说一句,确保你没有在click事件上放置任何preventDefault()!

暂无
暂无

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM