www.3manage.com
لایسنس آنتی ویروس

کار با ListBox ها در Html و جاوا اسکریپت

شما قادر هستید در برنامه خود از لیست هایی استفاده کنید که اطلاعاتی در آن قرار دهید ، هر چند با اضافه شدن به آنها ابعاد آنها تغییر نخواهد کرد و Design برنامه یا سایت خراب نشود که این کار توسط شی List Box قابل پیاده سازی است.

در زبان Html باید از کدهای جهت نمایش آنها استفاده کنید که در این قسمت در دسترس شماست.

شرح کدها:

دارای ۲ لیست و ۶ button به همراه توضیحات می باشد ، دکمه ها دارای قابلیت پیدا کردن فیلد انتخاب شده ، اضافه کردن ، تغییر و … می باشد.

نحوه استفاده:

کد ها را در یک فایل کپی کرده و اجرا کنید.

[php]
<form class="example" name="form04" method="" action="">
<p>
Pick an option …
<select name="field01" size="6">
<option value="a">Door number 1</option>
<option value="b">Door number 2</option>
<option value="c">Door number 3</option>
<option value="d">This box</option>
</select>
Pick some options …
<select multiple="multiple" name="field02" size="6">
<option value="a">Door number 1</option>
<option value="b">Door number 2</option>
<option value="c">Door number 3</option>
<option value="d">This box</option>
</select>
</p>
<p>
And click the button:
<br />
<input type="button" name="field03" value="Set to One"
onclick="document.form04.field01.options[0].selected=’true’;" />
<input type="button" name="field04" value="Set to New"
onclick="document.form04.field01.options[3].text=’A new car’;" />
<input type="button" name="field05" value="Set to Old"
onclick="document.form04.field01.options[3].text=’This box’;" />
<input type="button" name="field06" value="Find the One"
onclick="findtheone( );" />
<input type="button" name="field07" value="Find the Many"
onclick="findthemany( );" />
<input type="button" name="field08" value="Door number 4"
onclick="document.form04.field01.options[document.form04.field01.length]=
new Option(‘Door Number 4’, ‘e’);" />
</p>
</form>

<script type="text/javascript" language="JavaScript">
<!–
function findtheone( ) {
if (document.form04.field01.options[document.form04.field01.selectedIndex]) {
window.alert(‘You selected item ‘ +
(document.form04.field01.selectedIndex + 1));
}
else {
window.alert(‘You did not select and item’);
}
}

function findthemany( ) {
var outvar = ”;
var whichitem = 0;
while (whichitem < document.form04.field02.length) {
if (document.form04.field02.options[whichitem].selected) {
outvar = outvar + (‘You selected item ‘ + (whichitem + 1) + ‘: ‘ +
document.form04.field02.options[whichitem].text) + ‘\n’;
}
whichitem++;
}
if (outvar == ”) { outvar = ‘You did not select an item.’; }
window.alert(outvar);
}
// –>
</script>
[/php]

یک نظر بگذارید

دسته‌ها

اين سايت را حمايت مي کنم