2010-07-21 98 views
0

好吧,所以我想動態創建一個使用JavaScript的選擇列表,基本上當有人點擊一輛汽車使模型選擇下拉需要填充具體的製作模型,這是什麼我到目前爲止,這是非常業餘的,所以請原諒。生成窗體選擇與JavaScript不工作

這裏是我的Javascript嘗試:

function makeModel(obj){ 
model = new Array(); 
model[0] = new Array('ANY'); 
model[1] = new Array('212', 'Ace', 'Aceca', 'Cobra', 'Superblower'); 
model[2] = new Array('145', '146', '147', '147 3 Door', '147 5 Door', '155', '156', '159', '164', '166', '33', '75', '90', 'Alfasud', 'Alfetta', 'Arna', 'Brera', 'GT', 'GTV', 'Giulietta', 'Gold Cloverleaf', 'Mito', 'SZ', 'Spider', 'Sprint'); 
model[3] = new Array('Rocsta'); 
model[4] = new Array('DB7', 'DB9', 'DBS', 'Lagonda', 'V8', 'V8 Vantage', 'V8 Vantage Roadster', 'Vanquish', 'Vantage', 'Virage', 'Volante'); 
model[5] = new Array('100', '200', '400', '500', '80', '90', 'A2', 'A3', 'A4', 'A4 Avant', 'A4 Cabriolet', 'A4 Sedan', 'A5', 'A6', 'A8', 'Allroad', 'Cabriolet', 'Convertible', 'Coupe', 'Q5', 'Q7', 'Quattro', 'R8', 'RS2 Avant', 'RS4 Avant', 'RS4 Quattro', 'RS6', 'S2', 'S3', 'S4', 'S5', 'S6', 'S8', 'TT', 'Turbo'); 
model[6] = new Array('Allegro', 'Ambassador', 'Healey', 'Maestro', 'Maxi', 'Metro', 'Mini', 'Montego', 'Princess'); 
model[7] = new Array('1 Series', '1 Series 3 Door', '1 Series 5 Door', '1 Series Convertible', '1 Series Coupe', '3 Series', '3 Series Compact', '3 Series Convertible', '3 Series Coupe', '3 Series E46 2000-2005', '3 Series Sedan', '3 Series Touring', '5 Series', '5 Series GT', '6 Series', '7 Series', '8 Series', 'M Coupe', 'M1', 'M3', 'M5', 'M6', 'X1', 'X3', 'X5', 'X6', 'Z1', 'Z3', 'Z4', 'Z8'); 
model[8] = new Array('Valiant'); 
model[9] = new Array('Buggy'); 
model[10] = new Array('Arnage', 'Azure', 'Brooklands', 'Continental', 'Corniche', 'Eight', 'Mulsanne', 'Series II', 'Turbo R', 'Turbo RT'); 

var curSel=obj.options[obj.selectedIndex].value ; 
var x; 

document.write("<select name=\"test\" id=\"test\">"); 
for (x in model[curSel]) 
{ 
document.write("<option>" + mycars[curSel][x] + "</option>"); 
} 
document.write("</select>"); 


} 

下面是HTML:

<p> 
    <label for="make">Make: </label> 
    <select name="make" id="make" onchange="makeModel(this);"> 
    <option>Select one</option> 
    <option value="1">1</option> 
    <option value="2">2</option> 
    <option value="3">3</option> 
    <option value="4">4</option> 
    <option value="5">5</option> 
    <option value="6">6</option> 
    <option value="7">7</option> 
    <option value="8">8</option> 
    <option value="9">9</option> 
    <option value="10">10</option> 
    </select> 
</p> 

我的問題是,當我選擇在化妝列表中的選項,頁面變成空白它一直在加載一些東西,而我所看到的只是一個小小的下降dox而沒有任何東西。

現在我假設我需要定位一個特定的元素並生成該列表中的選擇列表?

Thanx提前!

回答

3

,有許多方法去了解這一點:

  • 有一個空的DIV和目標及其innerHTML屬性
  • 有下'make'一個SELECT元素,樣式屬性display設置爲none。在選擇的讓你可以動態地填充這個隱藏選擇使用new Option(val, text)及其display屬性重置爲block
0

首先我個人建議使用JS庫像jQuery,使頁面操作更加容易。這將使您可以非常輕鬆地在頁面上查找元素並添加新內容並使用它來執行其他一些操作。

其次document.write在頁面加載後總是一個壞主意。我剛剛注意到,anirvan-majumdar在我輸入的時候發佈了一個答案,並提供了很好的示例,說明如何在不使用外部庫的情況下執行此操作。