为什么在我的代码中没有发生这种情况 [英] why this is not happen in my code

问题描述

我在一个范围内有两个下拉列表

在第二个范围内同样下来的列表

两个跨度选择小时和分钟表格下拉

为此，我使用此代码

< select id =   hourselect size =   1 onclick =   loadhourselector（）>< / select> 
< select id =   minuteselect size =   1 onclick =   loadminuteselector（）>< / select> 

 function loadhourselector（）
 {
  var  start_time =  00 ; 
  var  end_time =  23 ; 
  for （ var  i = start_time; i  <  = end_time; i ++）
 {
 node = document.createElement（ 选项）; 
 textnode = document.createTextNode（i）; 
 node.appendChild（textnode）; 
 document.getElementById（  hourselect）。appendChild（node）; 
 
} 
} 
函数loadminuteselector（）
 {
  var  start_time =  00 ; 
  var  end_time =  59 ; 
  for （ var  i = start_time; i  <  = end_time; i ++）
 {
 node = document.createElement（ 选项）; 
 textnode = document.createTextNode（i）; 
 node.appendChild（textnode）; 
 document.getElementById（  minuteselect）。appendChild（node）; 
} 
} 

这项工作适用于拳头跨度下拉列表但是当我想申请第二跨度时它不接受输入

为什么??

第二跨度代码

< select id =   hourselect size =   1 onclick =   loadhourselector（）>< / select> 
< select id =   minuteselect size =   1 onclick =   loadminuteselector（）>< / select> 

解决方案

您在两个范围内都有重复的ID有id'hourselect'和'minuteselect'。

在你的JS函数中，你调用document.getElementById。根据您使用的浏览器，您可以因为重复ID而获得不同的行为。



您应该使用loadhourselector（this）模式，并使用'this'传递给调用appendChild的函数：

  function  loadhourselector（element）
 {
  var  start_time =  00 ; 
  var  end_time =  23 ; 
  for （ var  i = start_time; i< = end_time; i ++）
 {
 node =  document  .createElement（ 选项）; 
 textnode =  document  .createTextNode（i）; 
 node.appendChild（textnode）; 
 element.appendChild（node）; 
} 
} 

 <  < span class =code-leadattribute> select     id   =  hourselect    size   =  1    onclick   =  loadhourselector（this） >  <   / select  >  

i have two dropdownlist in one span
same down down list in second span
both span select hours and minute form drop down
for this i use this code

<select id="hourselect" size="1" onclick="loadhourselector()"></select>
                           <select id="minuteselect" size="1" onclick="loadminuteselector()"></select>

function loadhourselector()
        {
            var start_time = 00;
            var end_time = 23;
            for (var i = start_time; i <= end_time; i++)
            {
                node = document.createElement("Option");
                textnode = document.createTextNode(i);
                node.appendChild(textnode);
                document.getElementById("hourselect").appendChild(node);

            }
        }
        function loadminuteselector()
        {
            var start_time = 00;
            var end_time = 59;
            for (var i = start_time; i <= end_time; i++)
            {
                node = document.createElement("Option");
                textnode = document.createTextNode(i);
                node.appendChild(textnode);
                document.getElementById("minuteselect").appendChild(node);
            }
        }

this work for fist span drop down list but when i want to apply on second span it not take input
why??
code for second span

<select id="hourselect" size="1" onclick="loadhourselector()"></select>
                            <select id="minuteselect" size="1" onclick="loadminuteselector()"></select>

解决方案

You have duplicate id's, in both spans, the selects have id 'hourselect' and 'minuteselect'.
In your JS functions, you call document.getElementById. Depending on which browser you use, you can get different behavior because of duplicate id's.

You should probably use the loadhourselector(this) pattern, and use the 'this' passed to the function to call appendChild on:

function loadhourselector(element)
{
    var start_time = 00;
    var end_time = 23;
    for (var i = start_time; i <= end_time; i++)
    {
        node = document.createElement("Option");
        textnode = document.createTextNode(i);
        node.appendChild(textnode);
        element.appendChild(node);
    }
}

<select id="hourselect" size="1" onclick="loadhourselector(this)"></select>

这篇关于为什么在我的代码中没有发生这种情况的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！