0

我有一个页面，我想在其中使用功能。首先有一个 addTitle() 函数，该函数生成到一个 div 中。这是功能：

function addTitle(){


var ni = document.getElementById('div_fieldset');

var titleSpan = document.createElement("span");
ni.appendChild(titleSpan);
titleSpan.setAttribute("id","titleSpan");
titleSpan.setAttribute("class","fields");

if(titleSpan.previousSibling.nodeName=="#text"){    
    document.getElementById("titleSpan").style.paddingLeft="85px";
    titleSpan.style.width="86.5%";      
}else{
    var titleSelect = document.createElement("select");
    titleSelect.setAttribute("size","1");
    titleSelect.setAttribute("name","titleSelect");
    titleSelect.setAttribute("class","logicalOpSelect");

        orOption=document.createElement("OPTION");
        orText=document.createTextNode("OR");
        orOption.appendChild(orText);
        orOption.setAttribute("value","OR");
        titleSelect.appendChild(orOption);

        andOption=document.createElement("OPTION");
        andText=document.createTextNode("AND");
        andOption.appendChild(andText);
        andOption.setAttribute("value","AND");
        titleSelect.appendChild(andOption);

    titleSpan.appendChild(titleSelect);
}

    var titleSpanInner = document.createElement("span");
    titleSpan.appendChild(titleSpanInner);
    titleSpanInner.setAttribute("class","labels");
    titleSpanInner.innerHTML="Title";

    var titleInput = document.createElement("input");
    titleSpan.appendChild(titleInput);
    titleInput.setAttribute("class","input_text");
    titleInput.setAttribute("type","text");
    titleInput.setAttribute("name","title_input");
    titleInput.setAttribute("size","50");

    var removeButton = document.createElement("input");
    titleSpan.appendChild(removeButton);
    removeButton.setAttribute("id","removeTitle");
    removeButton.setAttribute("class","removeButton");
    removeButton.setAttribute("type","button");
    removeButton.setAttribute("value","Delete field");
    removeButton.setAttribute("onClick","remove(this.id)");
}

然后是html代码：

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"        "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="X-UA-Compatible" content="IE=8"/>
<title>Search</title>
<link rel="stylesheet" href="css/search.css" type="text/css" />
<meta http-equiv="Content-Type" content="text/html;charset=utf-8" />
</head>
<script type="text/javascript">
function AddTitle(){
   ...
   Here is the addTitle code, which is placed above
   ...
}
</script>
<body onload="addTitle();">
  <div id="box">
  <form name="search" method="post" action="search.php">
    <div id="div_fieldset">
    </div>
    <input class="button" type="submit" value="Search">
  </form>                                                               
  </div>
</body>
</html>

而在 Internet eplorer 8 或 9 中，field_set div 没有任何内容，只有 titleSpan 跨度。但是，如果我将整个 addTitle 源放入 field_set div，那么 addTitle 的最后一部分不会出现，这个：

var removeButton = document.createElement("input");
titleSpan.appendChild(removeButton);
removeButton.setAttribute("id","removeTitle");
removeButton.setAttribute("class","removeButton");
removeButton.setAttribute("type","button");
removeButton.setAttribute("value","Delete field");
removeButton.setAttribute("onClick","remove(this.id)");

问题是什么，解决方案是什么？谢谢！

4

0 回答 0