Home > Developer > Web Develop

Jquery.load () Introducing duplicate JS causes Ztree not available

Source: Internet
Author: User
Developer on Alibaba Coud: Build your first app with APIs, SDKs, and tutorials on the Alibaba Cloud. Read more ＞

Reprint Please specify the Source: Jiq ' s technical Blog

My page completes such a function, click on the left side of the page Ztree node when using jquery Ajax Request Background action query node details, and then in the div to the right of the page using the jquery load function load node details display page node.jsp.


Note: jquery load is a feature of jquery Ajax, where load can be used to load a page directly into a specified Div, and it can take parameters, the Load method format: Load (url,data,function (RESPONSE,STATUS,XHR)) 

<body><div class= "Container-fluid" ><div class= "row" ><div class= "col-md-4" ><div class= " Panel Panel-info Bootstrap-admin-no-table-panel "><div class=" panel-heading ">        <div class=" text-muted bootstrap-admin-box-title "> Configuration list </div>    </div><div class=" left Pre-scrollable " Style= "height:560px" ><ul id= "Configztree" class= "Ztree" style= "width:700px; Overflow:auto; " ></ul></div></div></div>        <div class= "col-md-7" >        <div id= "Configinfo" ></div>        </div>        <div class= "col-md-1" ></div></div></div>                    < /body>

Click the JS response function for the Ztree node: 

Ztree Click event     function Ztreeonclick (event, Treeid, TreeNode) {    if (treenode.level! = 0)    {    //alert ( Getpathtext (TreeNode));        $.ajax ({            type: "POST",            URL: "Dispnodeinfo.action",            data: {nodeid:treenode.id,nodename:treenode.name},            dataType: "JSON",            success:function (data) {                $ ("#configInfo"). Load ("Nodeinfo.jsp?data=" +data);            ,            error:function () {            $ ("#configInfo"). Load ("error.jsp");}}        );     }    ;

These all work, and then my focus on the Ztree node will appear when the new child node hover button, the effect is as follows:



This button clicks on the Ztree object in the div that will go to the node to increase the operation.

I directly focus and click on this new button no problem, can be normal new child nodes, but when the node, let the right side of the load nodes after the details, then click on the hover of the new byte point button, there is no effect, and an exception:


Gets the Ztree object to be empty!!! Does jquery have a problem with the load function???

So I added a blank JSP page to load, according to the above operation again, found to be able to add normal, so that is my node.jsp file problem, after troubleshooting, found that this page is again introduced Ztree JS file for the sake of:

<script type= "Text/javascript" src= "Js/ztree/js/jquery.ztree.all-3.5.min.js" ></script>

Remove it and work properly.

Jquery.load () Introducing duplicate JS causes Ztree not available

This article is an English version of an article which is originally in the Chinese language on aliyun.com and is provided for information purposes only. This website makes no representation or warranty of any kind, either expressed or implied, as to the accuracy, completeness ownership or reliability of the article or any translations thereof. If you have any concerns or complaints relating to the article, please send an email, providing a detailed description of the concern or complaint, to info-contact@alibabacloud.com. A staff member will contact you within 5 working days. Once verified, infringing content will be removed immediately.

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

Get Started for Free

  • Sales Support

    1 on 1 presale consultation

    Chat Contact Sales

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

    Open a Ticket

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.

    Learn More