Can an eval access external functions?
我的公司允许我们在网上的javascript编辑器中编写代码。其他库是预加载的,因此我们编写的代码可以访问这些库。
具体来说,我们可以在代码中使用underline.js和jquery.js函数。我们也可以使用我们自己的库graphie.js。
为了节省我自己的时间,我慢慢地建立了自己的一组函数,我将它们复制并粘贴到我编写的每一个代码中。这组函数现在太长了,我想从外部获取它(以节省空间等)。
1 | $.getScript( 'url/to/myfunctions.js' ) |
我试过上面的代码,但它太好了,不可能是真的。jquery函数
1 | $.get( 'url/to/myfunctions', eval ) |
上面的代码获取并成功地获取了
而不是
1 | $.get( 'url/to/myfunctions', eval ); |
尝试
1 | $.get( 'url/to/myfunctions', function(code) { eval(code); } ); |
这样,
1 2 3 4 5 6 7 8 | $.get( 'url/to/myfunctions', function(code) { eval(code); callback(); }); function callback() { // Your code goes here } |
解释
为了解释的目的,让我们使用这个简化的环境模型,在该模型中执行代码:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 | // JQuery is defined in the global scope var $ = { get: function( url, fn ) { var responses = { "url/to/myfunctions":"try {\ if(graphie) log('Graphie is visible.');\ } catch (e) {\ log('Graphie is not visible. (' + e + ')');\ }" }; fn( responses[url] ); } }; (function() { // Graphie is defined in a local scope var graphie = {}; (function() { // Your code goes here $.get("url/to/myfunctions", eval ); $.get("url/to/myfunctions", function(code) { eval (code); } ); })(); })(); |
1 2 3 4 5 6 7 | The output: function log(msg) { var el = document.createElement("li"); el.appendChild(document.createTextNode(msg)); output.appendChild(el); } |
如您所见,传递给
感谢大家的帮助,这是一个行之有效的解决方案…
1 2 3 4 5 6 7 | function everything(_,$,Graphie){ // every one of myfunctions now must be attached to the Graphie object like this: Graphie.oneOfMyFunctions = function(input1,input2,etc){ // content of oneOfMyFunctions } // the rest of myfunctions, etc. } |
然后在我的代码中,我可以用以下方法检索它:
1 2 | $.get( '//path/to/myfunctions', eval ) everything(_,jQuery,mygraphievar); |
不知何故,作为
此外,
应该注意,
我们还应该知道,使用
假设您拥有对该脚本的Ajax访问权限(因为在所示示例代码中,.get就是这样做的),您可以尝试使用jquery的
1 2 3 4 5 6 7 8 9 10 | $.ajax({ url: 'url/to/myfunctions.js', type: 'GET', success: function (result) { var script = '<scr'+'ipt>'+result+'</scr'+'ipt>'; var div = $(""); $("body").append(div); div.html(script); } }); |
在内部,该脚本最终将由jquery的
1 2 3 4 5 6 7 8 9 10 11 12 13 | // Evaluates a script in a global context // Workarounds based on findings by Jim Driscoll // http://weblogs.java.net/blog/driscoll/archive/2009/09/08/eval-javascript-global-context globalEval: function( data ) { if ( data && jQuery.trim( data ) ) { // We use execScript on Internet Explorer // We use an anonymous function so that context is window // rather than jQuery in Firefox ( window.execScript || function( data ) { window["eval" ].call( window, data ); } )( data ); } } |
我还问了一个与此相关的问题:为什么脚本将从使用jquery的html运行,而不是从使用innerhtml运行?
我建议不要使用
首先,在您的
1 2 3 | (function(_, $, graphie) { // declare all your functions here which makes use of the paramters }) // we will be calling this anonymous function later with parameters |
在拿到剧本之后你可以
1 2 3 4 5 6 | $.get( 'url/to/myfunctions', function(fn){ var el = document.createElement('script'); el.type = 'text/javascript'; el.text = fn + '(_, jQuery, Graphie);'; document.head.appendChild(el); }); |
注意,我把