1
スクリプトタグでDDL1にリンクされたダイナミックDROPDOWNLIST DDL2を作成しました。クリックしてサブミットボタンを押すとddl2のオプションでいくつかのページを開くようにします。 ddl1は5つの状態で構成され、ddl2は動的に接続された状態の位置で構成されます。 その下には、動的にリンクされたドロップダウンリストではないため、正常にリンクされたもう1つのddlもあります。 ddl2、つまりgoa asf、goa lpg roなどのページをページにリンクするコードを教えてください。 コードは以下の通りである：ダイナミックDDLをHTMLのSUBMITボタンとリンクする
<!DOCTYPE HTML>
<HTML>
<HEAD>
<TITLE> STATES</TITLE>
<script type="text/javascript">
function configureDropDownLists(ddl1,ddl2) {
var goa = ['GOA ASF', 'Goa LPG Plant'];
var maharashtra = ['AKOLA IRD', 'AURANGABAD LPG PLANT''WADALA I TERMINAL'];
var rajasthan = ['AJMER LPG PLANT ','AJMER TERMINAL', 'AWA-SALAWAS PIPELINE PROJ'];
var gujrat = ['AHMEDABAD NWZ LPG ', 'AHMEDABAD NWZ RETAIL', 'AHMEDABAD RETAIL RO'];
var madhyapradesh =['BAKANIA RIL', 'BHOPAL DSRO', 'BHOPAL RRO'];
switch (ddl1.value) {
case 'Goa':
ddl2.options.length = 0;
for (i = 0; i < goa.length; i++) {
createOption(ddl2, goa[i],goa[i]);
}
break;
case 'Maharashtra':
ddl2.options.length = 0;
for (i = 0; i < maharashtra.length; i++) {
createOption(ddl2, maharashtra[i],maharashtra[i]);
}
break;
case 'Rajasthan':
ddl2.options.length = 0;
for (i = 0; i < rajasthan.length; i++) {
createOption(ddl2, rajasthan[i],rajasthan[i]);
}
break;
case 'Gujrat':
ddl2.options.length = 0;
for (i = 0; i < gujrat.length; i++) {
createOption(ddl2, gujrat[i],gujrat[i]);
}
break;
case 'MadhyaPradesh':
ddl2.options.length = 0;
for (i = 0; i < madhyapradesh.length; i++) {
createOption(ddl2, madhyapradesh[i],madhyapradesh[i])
}
break;
default:
ddl2.options.length = 0;
break;
}
}
function createOption(ddl, text, value) {
var opt = document.createElement('option');
opt.value = value;
opt.text = text;
ddl.options.add(opt);
}
</script>
</HEAD>
<BODY>
<div>
<H1><FONT="TIMES ROMAN" FONT-COLOR="BLUE" > SELECT A STATE:</H1>
<select id="ddl" onchange="configureDropDownLists(this,document.getElementById('ddl2'))">
<option value=""></option>
<option value="Goa">Goa</option>
<option value="Maharashtra">Maharashtra</option>
<option value="Rajasthan">Rajasthan</option>
<option value="Gujrat">Gujrat</option>
<option value="MadhyaPradesh">MadhyaPradesh</option>
</select>
<select id="ddl2">
</select><br>
<br>
<input class="SubmitButton" type="submit" name="SUBMITBUTTON" value="Submit" style="font-size:20px; " />
</div>
<div>
<H1><FONT="TIMES ROMAN" FONT-COLOR="BLUE" > SELECT An ASSET:</H1>
<form id="link">
<select multiple="multiple" size="1">
<option value="http://stackoverflow.com/">4GB RAM PC- Lot 500 HCL</option>
<option value="http://google.com/">4GB RAM PC- Lot 450 HCL</option>
<option value="http://yahoo.com/">HD 245 Gold Lot 50</option>
<option value="http://bing.com/">Marathon 255 (40)</option>
<option value="http://php.net/">Wep HQ 2100 (20)</option>
<option value="ADF Scanner (45)">ADF Scanner (45)</option>
</select><BR>
<br>
<input class="SubmitButton" type="submit" name="SUBMITBUTTON" value="Submit" style="font-size:20px; ">
</form>
</div>
<script src="http://code.jquery.com/jquery-3.0.0.min.js"></script>
<script>
$('#link').on('submit', function (e) {
e.preventDefault();
var $form = $(this),
$select = $form.find('select'),
links = $select.val();
if (links.length > 0) {
for (i in links) {
link = links[i];
window.open(link);
}
}
});
</script>
</BODY>
</HTML>
上記のコードは私の全体のページのコードです。 また、私はそれをリンクするためにこのコードを受け取りましたが、動作しません。どうしてか分かりません。 ご存知の場合は、コードを教えてください。または、以下のコードで変更が必要なことを教えてください。
<!DOCTYPE HTML>
<HTML>
<HEAD>
<TITLE> STATES</TITLE>
<script src="http://code.jquery.com/jquery-3.0.0.min.js"></script>
<script type="text/javascript">
allLinks= {goa:{0:"google.com",1:"www.gmail.com"},
maharashtra :
{0:'www.yahoo.com',1:"www.microsoft.com",2:"www.apple.com"},
rajasthan :
{0:'www.stackoverflow.com',1:'www.cnn.com',2:'www.nasa.gov'}
}
function configureDropDownLists(ddl1,ddl2) {
var goa = ['GOA ASF', 'Goa LPG Plant', ];
var maharashtra = ['AKOLA IRD', 'AURANGABAD LPG
PLANT','WADALA I TERMINAL'];
var rajasthan = ['AJMER LPG PLANT ','AJMER
TERMINAL','UDAIPUR RRO'];
var gujrat = ['AHMEDABAD NWZ LPG ','AHMEDABAD NWZ RETAIL','VADODARA IRD '];
var madhyapradesh =['BAKANIA RIL', 'BHOPAL DSRO', 'BHOPAL RRO'];
switch (ddl1.value) {
case 'goa':
ddl2.options.length = 0;
for (i = 0; i < goa.length; i++) {
createOption(ddl2, goa[i],i);
}
break;
case 'maharashtra':
ddl2.options.length = 0;
case 'maharashtra':
ddl2.options.length = 0;
for (i = 0; i < maharashtra.length; i++) {
createOption(ddl2, maharashtra[i],i);
}
break;
case 'rajasthan':
ddl2.options.length = 0;
for (i = 0; i < rajasthan.length; i++) {
createOption(ddl2, rajasthan[i],i);
}
break;
case 'gujrat':
ddl2.options.length = 0;
for (i = 0; i < gujrat.length; i++) {
createOption(ddl2, gujrat[i],i);
}
break;
case 'madhyapradesh':
ddl2.options.length = 0;
for (i = 0; i < madhyapradesh.length; i++) {
createOption(ddl2, madhyapradesh[i],i);
}
break;
default:
ddl2.options.length = 0;
break;
}
}
function createOption(ddl, text, value) {
var opt = document.createElement('option');
opt.value = value;
opt.text = text;
ddl.options.add(opt);
}
$(document).ready(function(){
$('#link').on('submit', function (e) {
e.preventDefault();
alert('submited, opening link');
var $form = $(this);
$select1 = $form.find('select#ddl1').val(); //state
$select2 = $form.find('select#ddl2').val(); //city
window.open('http://'+allLinks[$select1][$select2]);
});
});
</script>
</head>
<BODY>
<div id='link'>
<form>
<select id="ddl1"
onchange="configureDropDownLists(this,document.getElemen
tById('ddl2'))">
<option value=""></option>
<option value="goa">Goa</option>
<option value="maharashtra">Maharashtra</option>
<option value="rajasthan">Rajasthan</option>
<select id="ddl2">
</select><br>
<br>
<input class="SubmitButton" type="submit" name="SUBMITBUTTON" value="Submit" style="font-size:20px; " />
</div>
</body>
</html>
ループをあなたを助けるとマッチが発生した場合、状態とそれらを比較する必要がありホープその後、次の操作を行います// window.open（newpage.list [I] .PAGE ）; }このコードを教えてもらえますか？ –
私はネットから得たコードが正しくないのですか？私はちょうど元のコードページを変更する必要があります。右？ –
次の回答に掲載されているコードを確認してください！ –