Question

我正在尝试用JS创建一个select元素，甚至编辑一个现有的元素，但我似乎错过了一些东西。如果这很重要，这是在Joomla完成的。

这是我的代码：

 var option = document.createElement("option");
var select = document.createElement("select");
 select.setAttribute("id", "chooseCat");

for(int i=0;i<LevelNames.Length;i++)
    {
      option.innerHTML = LevelNames[i];
      option.setAttribute("value",LevelIds[i]);
      document.getElementById("cat_chooser").appendChild(option);
      document.getElementById("cat_chooser").options.add(option);
    }

select.onchange=function()
{
  CreateDDL(this.options[this.selectedIndex].value);

}

var test = document.getElementById("cat_chooser");
test.appendChild(select);
document.add(select);
document.appendChild(select);

这是我尝试这样做的所有方式。 cat_chooser是页面上添加的SELECT。

任何帮助？

修改这是整个代码：

      <script language=\"javascript\" type=\"text/javascript\">


    //definitions
    var LevelNames = new Array();
    var LevelIds = new Array();
    boolean isFirstRun = true;


    //this functions create a Drop Down List 
    function CreateDDL(pid=null){

    //pass arrays for client side, henceforth : var id,var parent_it, var title
    <?php echo "\n".$id."\n".$parent_id."\n".$title."\n\n";?>
    if(pid){

    }
     if(isFirstRun)
        {
    for(int i=0; i < id.length;i++)
            {
    //if category has no parent
       if(parent_id[i] == "1")


            {
                LevelIds.push(id[i]);
                LevelNames.push(title[i]);

                }    
            }
        }
    else{
    for(int i=0; i < id.length;i++)
            {

    //if is a son of our target?
       if(parent_id[i] == pid)
            {
            LevelIds.push(id[i]);
            LevelNames.push(title[i]);

            }    
        }

}
//finished first run
isFirstRun=false;

//create the actuall drop down
//var option = document.createElement("option");
var select = document.createElement("select");
 select.setAttribute("id", "chooseCat");
for(var i=0;i<LevelNames.length;i++)
    {
       var option = new Option(/* Label */ LevelNames[i],
                              /* Value */ LevelIds[i]   );
      select.options.add(option);
    }

    select.onchange=function()
    {
      CreateDDL(this.options[this.selectedIndex].value);

    }
    var test = document.getElementById("cat_chooser");
    test.appendChild(select);
    //document.add(select);
    //document.appendChild(select);
    document.body.appendChild(select);

}
CreateDDL();
</script>

Answer 1

JavaScript 不 Java。您无法使用int或boolean来声明变量。相反，请使用var。
JavaScript 不 PHP。您无法使用function createDDL(pid=null)
.add方法仅在HTMLSelectElement.options对象中定义。
.appendChild应该在document.body，而不是 document上使用，因为您希望将elemet添加到正文，而不是文档。

工作代码，前提是<?php .. ?>返回有效的JavaScript对象。

<script language="javascript" type="text/javascript"> //No backslashes..
//definitions
var LevelNames = new Array();
var LevelIds = new Array();
var isFirstRun = true;

//this functions create a Drop Down List 
function CreateDDL(pid) {
    if(typeof pid == "undefined") pid = null; //Default value
    //pass arrays for client side, henceforth : var id,var parent_it, var title
    <?php echo "\n".$id."\n".$parent_id."\n".$title."\n\n"; ?>
    if (pid) {

    }
    if (isFirstRun) {
        for (var i = 0; i < id.length; i++) {
            //if category has no parent
            if (parent_id[i] == "1")

            {
                LevelIds.push(id[i]);
                LevelNames.push(title[i]);

            }
        }
    } else {
        for (var i = 0; i < id.length; i++) {

            //if is a son of our target?
            if (parent_id[i] == pid) {
                LevelIds.push(id[i]);
                LevelNames.push(title[i]);

            }
        }

    }
    //finished first run
    isFirstRun = false;

    //create the actuall drop down
    //var option = document.createElement("option");
    var select = document.createElement("select");
    select.setAttribute("id", "chooseCat");
    for (var i = 0; i < LevelNames.length; i++) {
        var option = new Option(/* Label */ LevelNames[i],
                                /* Value */ LevelIds[i]);
        select.options.add(option);
    }

    select.onchange = function () {
        CreateDDL(this.options[this.selectedIndex].value);

    }
    var test = document.getElementById("cat_chooser");
    test.appendChild(select);
    //document.add(select);
    //document.appendChild(select);
    document.body.appendChild(select);

}
CreateDDL();
</script>

Answer 2

您需要创建一个新元素并在每次迭代中追加它。目前，整个for循环将数据附加到相同的选项。

此外，在for循环语句中，您对i变量进行了类型转换，而这在JavaScript中是无法做到的。

无法使用JS创建\ edit select元素

2 个答案: