0

我收到一条错误消息，说“ this.nextSiblingElement.id is null ”，显然我已经为生成的元素设置了 ID。我承认仍然可以使用一些工作。我只是好奇 nextSiblingElement 的 ID 被返回为 null 的原因是什么。我确保前一个元素是在下拉菜单之前生成的，并且该菜单使用 previousChild.appendChild 放置在它之前。

如有必要，我可以编辑代码，但我不确定要显示多少才有意义。我只显示相关功能如下：

//helper function to add elements to the form
function createNewFormElement(inputForm, feildName, elementName, elementValue, elementType){

var inputString = String(feildName + ": <input name='" + elementName + "' type='" + elementType + "' /> ");
var newElement = document.createElement('div');

newElement.style.display = 'inline';

if (feildName == "Quantity" && containerType != "Box/Bag"){
    newElement.style.visibility = 'hidden';
}else{
    newElement.style.visibility = 'visible';
}
if (feildName == "Quantity"){
    newElement.id = "boxhide"+counter;
}else{
    newElement.id = 'dynamicInput';
}

newElement.innerHTML = inputString;

newElement.value = elementValue;
document.getElementById(inputForm.id).parentNode.appendChild(newElement);

return newElement;

}

//helper function to add dropdown
function createNewDropDown(inputForm, feildName, elementName){

    var dropDown, arValue;
    var newElement = document.createElement('div');

    newElement.id = 'dynamicInput';
    newElement.style.display = 'inline';

    dropDown = "<option value='" + containerType + "' selected>" + containerType + "</option>";


    for (i=0; i<conArray.length; i++){
        arValue = conArray[i];
        dropDown = dropDown + "<option value='" + arValue + "'>" + arValue + "</option>";
    }

    var inputString = String(feildName + ": <select onchange='switchMain(this.nextElementSibling.id);' name='" + elementName + "' id='" + elementName + "'>" + dropDown + "</select> ");

    newElement.innerHTML = inputString;
    document.getElementById(inputForm.id).parentNode.lastChild.previousSibling.appendChild(newElement);

    return newElement;
}
function getStyle(divName){

var temp = document.getElementById(divName).style.visibility;

return temp;
}

function switchMain(divName){

var e = document.getElementById("myContainers[]");
var strUser = e.options[e.selectedIndex].value;

if (strUser == "Box/Bag"){

    var current = getStyle(divName);

    //console.debug(current);

    document.getElementById(divName).style.visibility = "visible";
}else{
    document.getElementById(divName).style.visibility = "hidden";
}
}
4

1 回答 1

1

你有一个inputString喜欢

"… <select onchange='switchMain(this.nextElementSibling.id);' …&gt;…&lt;/select> "

现在，如果你执行

newElement.innerHTML = inputString;

您不能期望 select 元素有任何兄弟元素 - 它是 : 内的唯一（元素）节点newElement：

<div …&gt; … <select onchange='switchMain(this.nextElementSibling.id);' …&gt;…&lt;/select> </div>

因此，this.nextElementSiblingwill benull并且您在尝试获取其id属性时会遇到异常。

我确保前一个元素是在下拉菜单之前生成的，并且该菜单与 previousChild.appendChild 一起放置在它之前。

不，appendChild总是在最后插入新节点——不管新父节点在 DOM 中的位置。如果要在特殊位置插入元素，请使用insertBefore.

于 2013-02-13T19:36:42.130 回答