简体   繁体   English

为jsfiddle提取js的实用程序

[英]a utility to extract js for jsfiddle

I have this page . 我有这个页面。

If I save it as html and all the js code in the tags 如果我将其另存为html和标记中的所有js代码

but when I put the code in the script tags in the js part of jsfiddle.com, it won't load. 但是,当我将代码放在jsfiddle.com的js部分的script标签中时,它将不会加载。

code : 代码:

<html>
  <head>
    <script>
    var selele=0;
    var brindex=0;
   function addSelectBox ()
        {

    selele=selele+1;
    var spantag = document.createElement ("span");
        spantag.setAttribute("id",selele);

    var parentDiv = document.getElementById ("main");
        var selectElement = document.createElement ("select");  
    var selectElement1 = document.createElement ("select");   
    var selectElement2= document.createElement ("select");    
    var selectElement3 = document.createElement ("select");  

        var arr=new Array("Stocks","MutualFunds");
        var arr2=new Array("individual","401k","IRA");
        var arr3=new Array("contains","equals");
        var arr4=new Array("scrapedaccounttype","scrapedtransactiontype");
        var textbox = document.createElement('input');

        for(var i=0;i<arr.length;i++)
        {
        var option = new Option (arr[i]);           
        selectElement.options[selectElement.options.length] = option;


        }


        for(var i=0;i<arr2.length;i++)
        {
        var option = new Option (arr2[i]);          
        selectElement1.options[selectElement1.options.length] = option;


        }

        for(var i=0;i<arr3.length;i++)
        {
        var option = new Option (arr3[i]);          
        selectElement2.options[selectElement2.options.length] = option;


        }
        for(var i=0;i<arr4.length;i++)
        {
        var option = new Option (arr4[i]);          
        selectElement3.options[selectElement3.options.length] = option;


        }



spantag.appendChild (selectElement);
spantag.appendChild (selectElement1);
spantag.appendChild (selectElement2);
spantag.appendChild (selectElement3);   
spantag.appendChild (textbox);  


parentDiv.appendChild (spantag);
linebreak();

       }

       function removeSelect()
      {
         var parentDiv = document.getElementById ("main");
         var removetg = document.getElementById (selele);
         if(selele!=1)
        {
          parentDiv.removeChild (removetg); 
                 selele=selele-1;     


        }else
           {
        parentDiv.removeChild (removetg);
                parentDiv.innerHTML=""; 
            selele=selele-1;        
           }
          removeBreak();    

    }

        function linebreak()
    {
        brindex=brindex+1;
         var brtag =document.createElement ("br");
         brtag.setAttribute("id",brindex);
                 var parentDiv = document.getElementById ("main");
                                 parentDiv.appendChild (brtag);

    }

        function linespace()
        {
         var myElement = document.createElement("span");
         myElement.innerHTML ="&nbsp &nbsp &nbsp &nbsp &nbsp &nbsp";
        var parentDiv = document.getElementById ("main");
                 parentDiv.appendChild (myElement);
        }

    function removeBreak()
     {
             var myElement = document.getElementById(brindex);
             var parentDiv = document.getElementById ("main");
             brindex=brindex-1;
             parentDiv.removeChild (myElement);
     }


function xmlData()
{
xmlDoc=loadXMLDoc("data.xml");

newel=xmlDoc.createElement("edition");

x=xmlDoc.getElementsByTagName("span")[0];
x.appendChild(newel);



}



    </script>
  </head>
  <body>
    <div id="main1">
        <input type="button" onclick="addSelectBox ()" name="clickme" value="+"/>
<input type="button" onclick="removeSelect();" value="-"/>

<input type="button" onclick="xmlData();" value="XML" />

    </div>
    <div id="main">
    </div>

  </body>
</html>

It would be great if somebody would help me in running this. 如果有人可以帮助我运行它,那就太好了。

Pick the option in the JS Fiddle menu so it doesn't wrap all your code in an onload or onready function. 在JS Fiddle菜单中选择该选项,这样就不会将所有代码包装在onload或onready函数中。

Wrapping a function declaration in another function will cause it to be locally scoped, so you won't be able to access it as a global through an intrinsic event attribute like onclick . 在另一个函数中包装一个函数声明将导致它在本地范围内,因此您将无法通过诸如onclick类的内在事件属性以全局方式访问它。

Better yet, stop using globals and intrinsic event handler attributes and bind your event handlers unobtrusively with JavaScript. 更好的是,停止使用全局变量和内部事件处理程序属性,并使用JavaScript 毫不费力地 绑定事件处理程序。

You should review your code though you are repeating yourself 尽管您要重复自己的操作,但您应该查看代码

Works if you use plnkr 如果您使用plnkr,则可以使用

http://plnkr.co/edit/q2T980oTi9wsQQZd5sJ2?p=preview http://plnkr.co/edit/q2T980oTi9wsQQZd5sJ2?p=preview

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

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