Question

我制作了一个简单的动态表单来生成输入框。

<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>

这是javascript代码：

 (function () { 

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);

};

 });

我无法让它在jsFiddle上工作，按钮不起作用。

如果我将它嵌入标签中，它们可以正常工作。

任何人都可以帮我修复它们。

编辑：我想我是匿名添加的，因为我希望全局var selele and brindex用于所有这些功能。

我已经更改了代码。

JSFIDDLE

Answer 1

您的功能属于匿名功能，因此无法从外部获取。

首先从匿名函数中删除代码（请参阅此处：http://jsfiddle.net/uH84W/6/），然后修复您获得的控制台错误（我认为这不是整个代码）。

    function addSelectBox() {...

Answer 2

在你的小提琴中你选择onload但是你将onload改为no warp-in或者没有warp-in现在它工作正常

动态添加选择框

2 个答案: