2
Google Apps Script Web App 및 HtmlService를 사용하여 콘텐츠를 제공하고 appendChild가있는 입력 요소를 양식에 동적으로 추가하려고합니다. Chrome 24 및 IE 10에서 작동하지만 Firefox 19.0.2는 양식의 요소 목록을 업데이트하지 않습니다.Google Caja appendChild가 Firefox의 form.elements를 업데이트하지 않습니다.
웹 페이지에는 올바르게 표시되지만 Firefox에서는 appendChild를 사용하여 양식에 추가 한 입력 요소가 form.elements 컬렉션의 일부가 아닙니다. 이 문제는 Caja로 HTML을 살균하는 경우에만 나타납니다. jsfiddle에서 같은 코드를 사용하면 잘 작동합니다.
문제는 바로 다음 코드 인 here 볼 수 있습니다 :
나는이 주제에 발견 한 것과<html>
<head>
<title>Test</title>
<script type="text/javascript">
function print(form)
{
var str = "";
for(var v = 0; v < form.length; v++)
{
str += "<br>" + form[v].nodeName + "." + form[v].id + ": ";
if(form[v].elements != undefined)
for(var w = 0; w < form[v].elements.length; w++)
{
str += form[v].elements[w].name + ", ";
}
}
return str;
}
function submitForm()
{
document.getElementById("nameLookupHelp").innerHTML = (print(document.forms)) + "<br>Total Elements:" + document.forms[0].elements.length;
return;
}
function onLoad()
{
var name = document.getElementById("nameForm");
var t = document.createElement("input");
t.name = "TestInput";
//t.id = "TestInput";
name.appendChild(t);
}
</script>
</head>
<body onload="onLoad()">
<form name="nameForm" id="nameForm">
<input name="nameLookup" id="nameLookup">
<input type="button" id="bntNameForm" onclick="submitForm(this)" value="Lookup">
<div class="" id="nameLookupHelp">Please enter your name.</div>
</form>
</body>
</html>
, 파이어 폭스가 유효하지 않은 HTML을 좋아하지 않는다; 그러나, 내가 말할 수있는 것부터, HTML 출력은 완벽하게 유효합니다. 더 이상, jsfiddle에서 작동하기 때문에 Caja가 HTML과 Firefox와 상호 작용하는 방식에 문제가 있다고 가정합니다.
마지막으로, Firefox에서 양식 요소를 검사하고 마크 업 패널에서 양식 태그를 두 번 클릭 한 다음 (편집 취소)를 클릭하면 Firefox가 모든 요소를 감지하고 모든 것이 올바르게 작동합니다. Firefox가 HTML로 표시하는 내용은 변경되지 않습니다.
귀하의 도움에 감사드립니다.