2011-09-18 67 views
0

我已經有了表單設置和所有內容。如何在單擊「提交」按鈕時在網頁上顯示文本

<head> 
<script language="javascript"> 
var i; 
function fill_Cities(i){ 
var form1 = document.getElementById("form1a"); 
document.form1aa.Cities.options.length=0; 
switch(i) 
{ 
case 0: 
form1.Cities.options[0] =new Option('calcutta','calcutta'); 
form1.Cities.options[1] =new Option('Delhi','Delhi'); 
form1.Cities.options[2] =new Option('Bombay','Bombay'); 
break; 
case 1: 
form1.Cities.options[0] =new Option('Alabama','Alabama'); 
form1.Cities.options[1] =new Option('Alaska','Alaska'); 
form1.Cities.options[2] =new Option('Arizona','Arizona'); 
form1.Cities.options[3] =new Option('Arkansas','Arkansas'); 
form1.Cities.options[4] =new Option('California','California'); 
form1.Cities.options[5] =new Option('Colorado','Colorado'); 
form1.Cities.options[6] =new Option('Connecticut','Connecticut'); 
form1.Cities.options[7] =new Option('Delaware','Delaware'); 
form1.Cities.options[8] =new Option('District of Columbia','District of Columbia'); 
form1.Cities.options[9] =new Option('Florida','Florida'); 
form1.Cities.options[10] =new Option('Georgia','Georgia'); 
form1.Cities.options[11] =new Option('Hawaii','Hawaii'); 
form1.Cities.options[12] =new Option('Idaho','Idaho'); 
form1.Cities.options[13] =new Option('Illinois','Illinois'); 
form1.Cities.options[14] =new Option('Indiana','Indiana'); 
form1.Cities.options[15] =new Option('Iowa','Iowa'); 
form1.Cities.options[16] =new Option('Kansas','Kansas'); 
form1.Cities.options[17] =new Option('Kentucky','Kentucky'); 
form1.Cities.options[18] =new Option('Louisiana','Louisiana'); 
form1.Cities.options[19] =new Option('Maine','Maine'); 
form1.Cities.options[20] =new Option('Maryland','Maryland'); 
form1.Cities.options[21] =new Option('Massachusetts','Massachusetts'); 
form1.Cities.options[22] =new Option('Michigan','Michigan'); 
form1.Cities.options[23] =new Option('Minnesota','Minnesota'); 
form1.Cities.options[24] =new Option('Mississippi','Mississippi'); 
form1.Cities.options[26] =new Option('Montana','Montana'); 
form1.Cities.options[27] =new Option('Nebraska','Nebraska'); 
form1.Cities.options[28] =new Option('Nevada','Nevada'); 
form1.Cities.options[29] =new Option('New Hampshire','New Hampshire'); 
form1.Cities.options[30] =new Option('New Jersey','New Jersey'); 
form1.Cities.options[31] =new Option('New Mexico','New Mexico'); 
form1.Cities.options[32] =new Option('New York','New York'); 
form1.Cities.options[33] =new Option('North Carolina','North Carolina'); 
form1.Cities.options[34] =new Option('North Dakota','North Dakota'); 
form1.Cities.options[35] =new Option('Ohio','Ohio'); 
form1.Cities.options[36] =new Option('Oklahoma','Oklahoma'); 
form1.Cities.options[37] =new Option('Oregon','Oregon'); 
form1.Cities.options[38] =new Option('Pennsylvania','Pennsylvania'); 
form1.Cities.options[39] =new Option('Rhode Island','Rhode Island'); 
form1.Cities.options[40] =new Option('South Carolina','South Carolina'); 
form1.Cities.options[41] =new Option('South Dakota','South Dakota'); 
form1.Cities.options[42] =new Option('Tennessee','Tennessee'); 
form1.Cities.options[43] =new Option('Texas','Texas'); 
form1.Cities.options[44] =new Option('Utah','Utah'); 
form1.Cities.options[45] =new Option('Vermont','Vermont'); 
form1.Cities.options[46] =new Option('Virginia','Virginia'); 
form1.Cities.options[47] =new Option('Washington','Washington'); 
form1.Cities.options[48] =new Option('West Virginia','West Virginia'); 
form1.Cities.options[49] =new Option('Wisconsin','Wisconsin'); 
form1.Cities.options[50] =new Option('Wyoming','Wyoming'); 

break; 
case 2: 
form1.Cities.options[0] =new Option('Essex','Essex'); 
form1.Cities.options[1] =new Option('London','London'); 
form1.Cities.options[2] =new Option('Perth','Perth'); 
} 
} 
</script> 
</head> 

<form name="form1aa" method="post" action="" id="form1a" > 
<select name="country" onchange=" fill_Cities (document.form1aa.country.selectedIndex); "> 
<option value="India">India</option> 
<option value="U.S.A">U.S.A</option> 
<option value="United Kingdom">United Kingdom</option> 
</select> 
<select name="Cities"> 
</select> 
</form> 

我想點擊一個提交按鈕,用戶選擇一個城市來呈現一些文本後。優選地,在網頁而不是單獨的對話框中。

<input type="submit" /> 

我知道如何創建一個提交按鈕,但我不知道如何將其鏈接到城市形式和顯示文本。

+0

你想顯示什麼短信?你的問題有太多我們不需要的代碼,我們沒有足夠的信息。 –

+0

只有一行文字,如Pikmin。不過,這對每個城市都是獨一無二的。 –

回答

0

添加到您現有的JS代碼:

form1.addEventListener('submit', function() { 
    // Here you can add success message showing-code 
    // like: document.getElementById("div_with_message").style.display = 'block'; 
    return false; // return false to prevent the browser from submitting. Assuming that is what you want. 
}); 
0

你可以使用以下方法來獲得城市的選定值保持下拉,然後根據需要在應用程序/頁面使用此值:

var selectedValue = form1.Cities.options[form1.Cities.selectedIndex].value;

而且這是可以做到的onsubmit的形式。事情是這樣的:

註冊提交功能: form1.onsubmit=submitForm;

函數定義:

function submitForm() 
{ 
var selectedValue = form1.Cities.options[form1.Cities.selectedIndex].value; 
alert('value = ' + selectedValue); // for sample. change as you like 
} 
相關問題