تصف هذه المقالة طريقة JavaScript التي تتحكم في قائمتين لتبادل البيانات اليسرى واليمين. شاركه للرجوع إليه. التحليل المحدد هو كما يلي:
غالبًا ما نستخدم هذه الوظيفة ، والتي يمكن أن تحرك جميع عناصر مربع القائمة اليسرى إلى اليمين ، أو نقل جميع عناصر مربع القائمة اليمنى إلى اليسار ، أو تحريك جميع عناصر مربع القائمة اليمنى إلى اليسار ، أو تحريكها مرة واحدة.
نسخة الكود كما يلي: Function Listbox_movecross (SourceId ، destid) {
var src = document.getElementById (sourceId) ؛
var dest = document.getElementById (destid) ؛
لـ (var count = 0 ؛ count <src.options.length ؛ count ++) {
if (src.options [count] .selected == true) {
VAR OPTION = SRC.Options [count] ؛
var newoption = document.createElement ("Option") ؛
newOption.value = Option.value ؛
newOption.text = Option.text ؛
newOption.selected = true ؛
يحاول {
Dest.Add (newoption ، null) ؛ //معيار
src.remove (count ، null) ؛
} catch (خطأ) {
Dest.Add (newoption) ؛ // أي فقط
src.remove (count) ؛
}
عدد--؛
}
}
}
// ..
listbox_movecross ('CountryList' ، 'SelectCountryList') ؛
فيما يلي رمز تأثير تجريبي يمكن تنفيذه مباشرة في المتصفح
انسخ الرمز كما يلي: انقر أدناه الأزرار لنقل الخيارات المحددة إلى اليمين أو اليسار. <br>
<griding>
<tbody> <tr>
<td>
<SELECT ID = "SourceSelect" Size = "10" MONITION = "">
<Option Value = "A"> أفغانستان </option>
<Option Value = "B"> جزر البهاما </option>
<Option Value = "C"> Barbados </soph>
<Stion Value = "D"> Belgium </soph>
<Option Value = "E"> Bhutan </portive>
<Option Value = "F"> China </soph>
<Option Value = "G"> كرواتيا </orpion>
<Option Value = "H"> Denmark </soph>
<Stion Value = "I"> France </soph>
</select>
</td>
<td>
<button onClick = "listboxmovecross ('SourceSelect' ، 'DeceSlect') ؛" >>>> </butten> <br>
<button onClick = "listboxmovecross ('defectlect' ، 'sourceselect') ؛"> <<</button>
</td>
<td>
<SELECT ID = "DESSELECT" size = "10" MONITION = "">
<Option Value = "A"> أفغانستان </option>
<Option Value = "B"> جزر البهاما </option>
<Option Value = "C"> Barbados </soph>
<Stion Value = "D"> Belgium </soph>
<Option Value = "E"> Bhutan </portive>
<Option Value = "F"> China </soph>
<Option Value = "G"> كرواتيا </orpion>
<Option Value = "H"> Denmark </soph>
<Stion Value = "I"> France </soph>
</select>
</td>
</r>
</tbody> </table>
<script>
دالة listboxmovecross (sourceId ، destid) {
var src = document.getElementById (sourceId) ؛
var dest = document.getElementById (destid) ؛
لـ (var count = 0 ؛ count <src.options.length ؛ count ++) {
if (src.options [count] .selected == true) {
VAR OPTION = SRC.Options [count] ؛
var newoption = document.createElement ("Option") ؛
newOption.value = Option.value ؛
newOption.text = Option.text ؛
newOption.selected = true ؛
يحاول {
Dest.Add (newoption ، null) ؛ //معيار
src.remove (count ، null) ؛
} catch (خطأ) {
Dest.Add (newoption) ؛ // أي فقط
src.remove (count) ؛
}
عدد--؛
}
}
}
</script>
آمل أن تكون هذه المقالة مفيدة لبرمجة JavaScript للجميع.