我有一个带有select的表单来创建元素。我怎么能做这个元素只创造一次?

时间:2016-01-31 14:31:11

标签: javascript html select input

我有JS代码,根据html创建段落和输入元素。但我需要这段代码才能只创建一次元素。

Javascript代码的和平

function comFunction(sel) {
   switch (sel.value) {
        case 'skype':
            var skype = document.createElement("P");
            var temp = document.createTextNode("Enter your skype");
            var input = document.createElement("input");
            input.type = "text";
            skype.appendChild(temp);
            form.appendChild(skype);
            form.appendChild(input);
            break;
}

HTML代码

<form id="form">
<select name="liason" id="liason" onchange="comFunction(this);">
    <option value="skype">Skype</option>
    <option value="icq">ICQ</option>
    <option value="facebook">Facebook</option>
    <option value="email">e-mail</option>
</select>
</form>

1 个答案:

答案 0 :(得分:0)

如果向正在创建的元素添加id并将其附加到DOM,则可以在运行第二次创建它们的代码之前检查它们是否存在:

 function comFunction(sel) {

   switch (sel.value) {
    case 'skype':
        if(document.getElementById("skypeParagraph") === null) {
           var skype = document.createElement("P");
           skype.setAttribute("id", "skypeParagraph");
           var temp = document.createTextNode("Enter your skype");
           var input = document.createElement("input");
           input.type = "text";
           skype.appendChild(temp);
           form.appendChild(skype);
           form.appendChild(input);
        }
        break;
 }