In easyUI development, the jquery. easyui. min. js function library problem occurs. jquery. easyui. min. js
EasyUI is a private plug-in of jquery. EasyUI is easy to use and contains the three most important blocks for webpage creation: javascript code, html code, and Css style. After importing the easyUI library, we can directly copy and paste the code in it, so as to easily set up the webpage.
First, import the easyUI function library:
<link rel="stylesheet" type="text/css" href="easyui/themes/default/easyui.css"> <link rel="stylesheet" type="text/css" href="easyui/themes/icon.css"> <script type="text/javascript" src="easyui/jquery-1.7.2.min.js"></script> <script type="text/javascript" src="easyui/jquery.easyui.min.js"></script>
Project code:
<! DOCTYPE html>
The above Code does not have any problems, but the following error occurs:
An error occurs: The easyUImini. js library has a problem, but the function library has been written and tested by others. Theoretically, it cannot be wrong.
Through various attempts, it is found that after alert (11) is added, the browser will not report errors, and javascript code can be executed smoothly:
<Script type = "text/javascript"> $ (function () {alert (11); $ ('# tt '). tabs ('add', {title: 'view', content: 'tab body', closable: true, tools: [{iconCls: 'icon-mini-refresh ', handler: function () {alert ('refresh') ;}}]}) ;}); </script>
After we change the jQuery code to window. onload (), the code still runs normally:
<Script type = "text/javascript"> window. onload = function () {$ ('# tt '). tabs ('add', {title: 'view', content: 'tab body', closable: true, tools: [{iconCls: 'icon-mini-refresh ', handler: function () {alert ('refresh') ;}}]}) ;}</script>
Summary:
1. Differences between window. onload () and $ (function () {})
A) window. onload () is to wait until all the elements on the page are loaded (including dom and javascript), and then execute the function code in it.
B) $ (function () {}) waits until the dom element of the page is loaded and then runs the function code
2. Because we used easyUI for development and imported javascript code in advance, but after using $ (function () {}), javascript has not been loaded yet, so jquery. easyui. min. the js library reports an error. Therefore, when using easyUI for development projects, remember not to use $ (function () {}). Instead, we recommend that you use window. onload ().