好的，这是我现在的新javascript代码：
var counter = <? echo $count-1 ?>;
var limit = 24;
function addInput(divName){
if (counter >= limit) {
alert("You have reached the limit of adding " + counter + " inputs");
}
else {
var newdiv = document.createElement('div');
var dropDown;
var fromPHP=<? echo $s_to_json ?>;
for (i=0; i<fromPHP.length; i++){
yourValue = fromPHP[i];
dropDown = dropDown + "<option value='" + yourValue + "'>" + yourValue + "</option>";
}
//document.write(dropDown);
var containerType = "<?echo $matRow['container']?>";
var viz;
if (containerType == "Box/Bag"){
viz = "visible";
}else{
viz = "hidden";
}
newdiv.innerHTML = "Weight " + (counter + 1) + ": <input type='text' name='myWeights[]' class='putty' maxlength='6' /> Material " + (counter + 1) + ": <input type='text' name='myMaterials[]' class='plato' maxlength='17' value='<? echo (isset($matRow['material']) ? $matRow['material'] : '')?>' /> Container " + (counter + 1) + ": <select onchange='"switchMain(this.nextSibling.nextSibling.id);'" name='myContainers[]' id='myContainers[]'><option value='<? echo (isset($matRow['container']) ? $matRow['container'] : '') ?>' selected><? echo (isset($matRow['container']) ? $matRow['container'] : '') ?></option>' + dropDown + '" + dropDown + "</select><div id='boxhide[]' style='visibility:" + viz + ";display:inline;'> Quantity " + (counter + 1) + ": <input type='text' name='boxnum" + (counter + 1) +"' class='boxputty' maxlength='2' /></div>";
document.getElementById(divName).lastChild.parentNode.appendChild(newdiv);
counter++;
}
}
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;
//console.debug(strUser);
//console.debug(divName);
if (strUser == "Box/Bag"){
var current = getStyle(divName);
//console.debug(current);
document.getElementById(divName).style.visibility = "visible";
}else{
document.getElementById(divName).style.visibility = "hidden";
}
}
function removeInput(divName){
if (counter<=1){
alert("You cannot remove any more weights from this job.");
}
else {
var olddiv = document.getElementById(divName);
var lastChild = olddiv.lastChild;
if (lastChild && lastChild.parentNode && lastChild.parentNode.removeChild){
lastChild.parentNode.removeChild(lastChild);
counter--;
}
}
}
下面是调用它的脚本部分：
Weight <? echo $count ?>: <input type="text" class="putty" name="myWeights[]" maxlength="6" value="<? echo $read ?>" autofocus /> Material <? echo $count ?>: <input type="text" class="plato" name="myMaterials[]" maxlength="17" value="<? echo (isset($matRow["material"]) ? $matRow["material"] : "") ?>" />
Container <? echo $count ?>: <select onchange="switchMain(this.nextSibling.nextSibling.id);" name="myContainers[]" id="myContainers[]">
<option value="<? echo (isset($matRow["container"]) ? $matRow["container"] : "") ?>" selected><? echo (isset($matRow["container"]) ? $matRow["container"] : ""); ($matRow['container'] == 'Box/Bag' ? $vishid = 'visible' : $vishid = 'hidden') ?></option>
<?
<div id='boxhide[]' style="visibility:<? echo $vishid ?>;display:inline;">
Quantity <? echo $count ?>: <input type="text" name="boxnum[]" class="boxputty" maxlength="2" />
</div>
<input type="button" alt='Add Weight' title='Add Weight' value="+" onClick="addInput('dynamicInput');">
<input type="button" alt='Remove Weight' title='Remove Weight' value="-" onClick="removeInput('dynamicInput');">
我删掉了所有不必要的内容。
截至目前，当用户单击以添加行时，它会将其放置在错误的位置，但我相信我可以像以前一样对其进行排序。更大的问题是，通过单击"+"按钮添加的任何行在更改由 switchMain（） 检查的下拉菜单时都会出错。错误显示为"TypeError： this.nextSibling.nextSibling is null"。
任何建议都会很棒！谢谢！
因此，这里有一些明显的，尽管不一定容易听到的建议，用于清理您的编码方法，以使您的生活更轻松，并可能使您的问题在未来更容易回答：
干净地分离 php 和 js
尽可能将 php 和 javascript 分开。 如果你必须将数据从js传递给php，我建议使用一种更规范的方法，预先初始化所有php变量，然后稍后在javascript中使用它们：
var counter = <? js_escape($count-1); ?>;
var fromPHP=<? js_escape($s_to_json); ?>; // Null if not available
var jsVarFromPhp = <?php escape($necessary_var);?>;
var anotherVariable = <?php escape($another_var);?>;
var materialArray = <? echo json_encode($material_array);?>;
// then the js actually does stuff with javascript variables, ideally wrapped within a function, no php in the logic of your javascript.
隔离 JavaScript 行为
当你处理像这样的复杂语言组合时，通常最好将 php 行为与 javascript 行为隔离开来。 http://jsfiddle.net 非常适合此，请采用您想要的 js 行为和您期望的 html，并将其放入测试用例中。 你必须将你的php变量转换为它们的值，但它会简化测试用例，所以建议你自己调试。
摆脱直接在 html 中使用 echo 的习惯
你直接在你的html中回显东西。 这将最终导致XSS。 省去麻烦并使用模板引擎（如果只是一个小项目，则很小）。 聪明是受欢迎的，并且有效。 如果你觉得出于某种原因你必须在原生 php 中工作，试着在你的 html 中避免使用 php 逻辑，并给自己一个包装函数，使 php 尽可能干净，比如：
function h($dirty){
echo htmlentities($dirty, ENT_QUOTES | ENT_IGNORE, 'UTF-8');
}
像这样使用：
<input value='<?php h($input_value);?>'>
不过，我仍然推荐模板引擎方法。