将选项输出到select的小javascript不起作用_Javascript_Php_Html

将选项输出到select的小javascript不起作用

javascript php html

将选项输出到select的小javascript不起作用,javascript,php,html,Javascript,Php,Html,我正在制作一个小网页。目标很简单。我有一个选择与几个选项；这是行星名称；它们的大小放在每个选项的值括号中。我想做的是，在选择一个选项（一个星球）时，javascript代码将采用该选项的大小，并为另一个选择括号提供新选项。因此，根据第一个选择，第二个选择括号将提供新选项这段代码很简单，我已经看过了，但没有错误我就是不明白什么不起作用。代码如下： <select id="selectedplanet" name="selectedplanet" onchange="jcab3();"&g

我正在制作一个小网页。目标很简单。我有一个选择与几个选项；这是行星名称；它们的大小放在每个选项的值括号中。我想做的是，在选择一个选项（一个星球）时，javascript代码将采用该选项的大小，并为另一个选择括号提供新选项。因此，根据第一个选择，第二个选择括号将提供新选项

这段代码很简单，我已经看过了，但没有错误

我就是不明白什么不起作用。代码如下：

<select id="selectedplanet" name="selectedplanet" onchange="jcab3();">

<?php 
while($fetch28a3=mysqli_fetch_array($query28a3)){
echo('<option value="'.$fetch28a3[1].'">'.$fetch28a3[0].'</option>');
}?>
</select><br/>
<p>Location: </p><br/><br/><p>X:</p><select id="locationx" name="locationX"></select><br/><p>Y:</p><select id="locationy" name="locationY"></select>



土
火星
木星
X:


Y:
document.getElementById（“myplanet”）.addEventListener（'change'，function（）{
var e=document.getElementById（“myplanet”）；
var value=e.options[e.selectedIndex].value；
var prima=parseInt（值）
var final2=“”；
var final3=“”；
对于（i31=0；i31您在
中添加了多少新的
标记
想想@Michael Bogwardt在评论中所说的：
但是，使用innerHTML的DOM操作速度较慢，而且更复杂
与基于单个DOM对象的操作相比，更容易发生故障
最好使用元素.appendChild（）
和元素.setAttribute（）
函数创建
s标记。您的代码可能如下所示：
function jcab3(){
   var prima=parseInt(document.getElementById("selectedplanet").value);

   var x = document.getElementById("locationx");
   var y = document.getElementById("locationy");

   for(i31=0;i31<prima;i31++){

     var option = x.appendChild("OPTION");
     option.setAttribute("value", i31); 

   }

   for(i32=0;i32<prima;i32++){

     var option = y.appendChild("OPTION");
     option.setAttribute("value", i32); 

   }    
}

函数jcab3（）{
var prima=parseInt（document.getElementById（“selectedplanet”）.value）；
var x=document.getElementById（“locationx”）；
var y=document.getElementById（“locationy”）；
对于（i31=0；i31非常感谢您的帮助，但我从未学习过jquery…我认为javascript足以满足我的需要。我已经编辑了我的答案。现在它只使用javascript，不使用jquery。如果有用，请您投票给我的答案好吗谢谢。我已经投票给了您的答案。我将查看这两个答案，并决定哪一个是我最喜欢的。但是又是脚踝
<!DOCTYPE html>
<html>
<head>

</head>
<body>
<select id="myplanet">
    <option value="4">Earth</option>
    <option value="5">Mars</option>
    <option  value="6">JUpiter</option>
</select>

<p>X:</p>
<select id="locationx" name="locationX"></select><br/>
<p>Y:</p>
<select id="locationy" name="locationY"></select>

<script>

  document.getElementById("myplanet").addEventListener('change', function(){
  var e = document.getElementById("myplanet");
var value = e.options[e.selectedIndex].value;
    var prima =  parseInt( value )
    var final2="";
    var final3="";
    for(i31=0;i31<prima;i31++){
       final2=final2+'<option value="'+i31+'">'+i31+'</option>';

    }
    for(i32=0;i32<prima;i32++){
        final3=final3+'<option value="'+i32+'">'+i32+'</option>';
    }

    document.getElementById("locationx").innerHTML = final2
    document.getElementById("locationy").innerHTML = final3


  })

</script>
</body>
</html>

function jcab3(){
   var prima=parseInt(document.getElementById("selectedplanet").value);

   var x = document.getElementById("locationx");
   var y = document.getElementById("locationy");

   for(i31=0;i31<prima;i31++){

     var option = x.appendChild("OPTION");
     option.setAttribute("value", i31); 

   }

   for(i32=0;i32<prima;i32++){

     var option = y.appendChild("OPTION");
     option.setAttribute("value", i32); 

   }    
}