Javascript代码功能说明

Question

的情况是，我有一个下拉框，如下

<td>Select Country:</td> 
<td><select id="bcountry" name="bcountry"></select> 
<script language="javascript">print_country("bcountry")</script></td> 

我已经在我的JavaScript国家的数组文件

var country_arr = new Array("Afghanistan", "Albania",....,"n); 

现在在下面的代码这个功能是从html调用我真的不知道下面的函数如何工作

function print_country(country_id) 
{ 
// given the id of the <select> tag as function argument, it inserts <option> tags 
var option_str = document.getElementById(country_id); 
option_str.length=0; 
option_str.options[0] = new Option('Select Country',''); 
option_str.selectedIndex = 0; 
    for (var i=0; i<country_arr.length; i++) 
     { 
    option_str.options[option_str.length] = new Option(country_arr[i],country_arr[i]); 
    } 
} 

任何关于ËPLZ解释一步这上面的函数print_country一步我

感谢名单

Answer 1

我加了一些行号的就事论事：

function print_country(country_id) 
{ 
     // given the id of the <select> tag as function argument, it inserts <option> tags 
    1. var option_str = document.getElementById(country_id); 
    2. option_str.length=0; 
    3. option_str.options[0] = new Option('Select Country',''); 
    4. option_str.selectedIndex = 0; 
    5. for (var i=0; i<country_arr.length; i++) 
    6. { 
    7.   option_str.options[option_str.length] = new Option(country_arr[i],country_arr[i]); 
    8. } 
} 

1号线：将文档对象模型（DOM）元素加载到变量中option_str
第3行：创建一个新对象Option("label","value")并将其指定给option_str的options数组零（0）。
第4行：所选索引设置为零（0），它是options数组中的第一个元素。
第5行：您正在从零（0）循环到country_arr的长度并每次递增i。
第7行：创建一个新对象Option("label","value")，并将其指定给最后位置的option_str的options数组。 Option对象包含标签和值country_arr中的i th元素。

希望清除它！

Answer 2

Your code：

• 创建一个空的<select>下拉
• 脚本然后进行基于ID，以你的下拉参考，由country_id
• 脚本放置一个选项，标签为“选择国家”，一个占位符，作为第一个选项，以空字符串作为值。
• 然后它为country_arr阵列中的每个项目附加<option>。它们中的每一个对其标签及其值使用相同的值。

Answer 3

我在你的代码中添加注释。

function print_country(country_id) // this is function declaration, have one parameter : country_id 
{ 
    // given the id of the <select> tag as function argument, it inserts <option> tags 
    var option_str = document.getElementById(country_id); // Get the element in your html with the id equals to country_id, the element should be a dropdown list 
    option_str.length=0 // clear the dropdown list item 
    option_str.options[0] = new Option('Select Country',''); // add first item in dropdown list 
    option_str.selectedIndex = 0; // set selected item to dropdown list 
    for (var i=0; i<country_arr.length; i++) // loop for the array 
    { 
     option_str.options[option_str.length] = new Option(country_arr[i],country_arr[i]); // create new item in your dropdown list 
    } 
} 

更多： Javascript Select

Answer 4

1. 创建option_str，指向它COUNTRY_ID
2. 添加报头以它（ “选择国家”）
3. 然后通过country_arr阵列迭代，并增加了每个国家的option_str控制（即country_id）。

Answer 5

以下是功能print_country的分解说明。

function print_country(country_id) 
{ 

它表示print_country功能块的开始。

var option_str = document.getElementById(country_id); 

这种说法只是给出了country_id代表的DOM元素。

option_str.length=0; 

给出与显示值Select Country和实际值的空字符串的HTML option元件的option_str的长度被设定为0。

option_str.options[0] = new Option('Select Country',''); 

第一项option_str。

option_str.selectedIndex = 0; 

它将默认值设置为第一个选项值，即'选择国家'。

for (var i=0; i<country_arr.length; i++) 

它是一个for在阵列country_arr上循环。

 { 
    option_str.options[option_str.length] = new Option(country_arr[i],country_arr[i]); 

现在，在第一循环中，option_str长度为1，因为它有一个元素Select Country。因此，option_str在country_arr的循环数组上分配了HTML option元素。

} 
} 

希望能够澄清。

Answer 6

country_id被传递是您的选择框的ID。该函数获取本声明的对象：

var option_str = document.getElementById(country_id); 

长度被初始化为0最初和默认值也设置在这里：

option_str.length=0; 
option_str.options[0] = new Option('Select Country',''); 

通过包括默认选项，长度加1。 然后在国家的循环选项内设置，直到达到country_arr长度的末尾。

Answer 7

不知道这个功能正在从所谓的，这里是什么功能是这样做的：

function print_country(country_id) 
//function name with the argument "country_id". 
//Wherever this function is being called it is calling it as 
//"print_country('bcountry'); 
//the "bcountry" in the function call is found in the id of the <select /> tag in the HTML 
{ 
// given the id of the <select> tag as function argument, it inserts <option> tags 
var option_str = document.getElementById(country_id); 
//"option_str" is now the name of the <select /> object 
option_str.length=0; 
//setting the option_str length to 0 eliminates the <option /> tags that are normally 
//a part of the <select />, essentially clearing the drawing board to avoid duplications 
option_str.options[0] = new Option('Select Country',''); 
//this command creates the first select <option/> giving the user the instruction to Select a country 
option_str.selectedIndex = 0; 
//now the selected <option />, the one that will appear in the <select> window is the instruction that was just created 
    for (var i=0; i<country_arr.length; i++) 
     { 
    option_str.options[option_str.length] = new Option(country_arr[i],country_arr[i]); 
    } 
//the "for" loop, above, cycles through the array and for each member of the Array it creates a new <option> for the <select> tag 
} 

Answer 8

将selectbox html对象分配给变量option_str。

var option_str = document.getElementById(country_id); 

设置选项的数目为0。（如果有任何我猜的HTML）

option_str.length=0; 

设置第一个选项的值，以“选择国家”

option_str.options[0] = new Option('Select Country',''); 

设置默认选择的选项，第一个选项。

option_str.selectedIndex = 0; 

循环遍历country_arr数组。

for (var i=0; i<country_arr.length; i++) 

下面的代码将在country_arry每个项目执行一次。

在javascript中，你可以任何项目在任何索引的语法如下添加到一个数组：

myArray[index] = item 

确保插入发生在数组的结尾。

option_str.options[option_str.length] 

由于阵列以JavaScript是0类，和length属性开始于1，使用option_str.length作为指标可确保将在该阵列的端部插入。

插入新的选项，其中选项的文本是在country_arr 和期权价值目前产品还在country_arry

new Option(country_arr[i],country_arr[i])