В этой статье описывается практический метод нажатия по всему окну ввода, чтобы вспомнить окно выбора в JS+CSS. Поделитесь этим для вашей ссылки. Конкретный метод реализации следующим образом:
Скопируйте код следующим образом: <! Doctype html public "-// w3c // dtd xhtml 1.0 transitional // en" "http://www.w3.org/tr/xhtml1/dtd/xhtml1-transitional.dtd">
<html xmlns = "http://www.w3.org/1999/xhtml">
<голова>
<TILE> JS+CSS создает практическое поле для ввода ввода, эффект выбора всплывающего окна </title>
<стиль типа = "text/css">
.BLACK_OVERLAY {DISPLAY: NONE; POLICE: ABSOLUTE; TOP: 0%; слева: 0%; Ширина: 100%; Высота: 100%; фоновый цвет: #fffff; z-index: 1001; -moz-option: 0,8; непрозрачность: .80; фильтр: альфа (непрозрачность = 80);};
.white_content {Display: None; Position: Absolute; Top: 25%; слева: 25%; ширина: 50%; высота: 50%; накладка: 16px; граница: 16px сплошной апельсин; маржа: -32px; фоновый цвето
</style>
<script language = "javascript" type = "text/javascript">
функция перемещается (obj, Target, All) {
if (! All) All = 0
if (obj! = "[object]") obj = eval ("document.all."+obj)
target = eval ("document.all."+target)
if (все == 0)
{
while (obj.selectedIndex> -1) {
//Alert(Obj.selectedIndex)
mot = obj.options [obj.selectedIndex] .Text
mov = obj.options [obj.selectedIndex]
obj.remove (obj.selectedIndex)
var newoption = document.createElement ("опция");
NewOption.Text = Mot
NewOption.value = MOV
target.add (newoption)
}
}
еще
{
//alert(obj.options.length)
для (i = 0; i <obj.length; i ++)
{
mot = obj.options [i] .Text
mov = obj.options [i] .value
var newoption = document.createElement ("опция");
NewOption.Text = Mot
NewOption.value = MOV
target.add (newoption)
}
obj.options.length = 0
}
}
функция dakai () {
document.getelementbyid ('light'). style.display = 'block';
document.getElementById ('fade'). style.display = 'block'
}
функция guanbi () {
// передавать значение выбора справа на текстовое поле
var yuangong = document.getElementByid ("yuangong")
yuangong.value = "" // Если это предложение не добавлено, результат каждого выбора будет добавлено.
var huoque = document.getElementById ("D2")
для (var k = 0; k <huoqu.length; k ++)
yuangong.value = yuangong.value + huoque.options [k] .value + "" // "" "Середина - это пространство, сепаратор символов, который может быть изменен на другой
document.getElementbyId ('light'). style.display = 'none';
document.getElementById ('fade'). style.display = 'Нет'
}
</script>
</head>
<тело>
<input type = "text" id = "yuangong" onclick = "dakai ()" size = "50">
<div id = "light">
<Таблица ID = "table4" bordercolor = "#cccccc" bordercolordark = "#cccccc" bordercolorlight = "#fffff" cellpadding = "3" cellpacing = "0">
<tr>
<td align = "center" valign = "middle">
Сотрудники в этом отделе
<select size = "12" name = "d1" ondblclick = "moveselect (this, 'd2')" multy = "multy">
<option value = "Zhang San"> Zhang San </option>
<option value = "li si"> li si </option>
<option value = "xiao wang"> xiao wang </option>
</select>
</td>
<td align = "center" valign = "middle">
<input type = "button" value = "<<" name = "b3" onclick = "moveselect ('d2', 'd1', 1)"> <br>
<input type = "button" value = "<" name = "b5" onclick = "moveselect ('d2', 'd1')"> <br>
<input type = "button" value = ">" name = "b6" onclick = "moveselect ('d1', 'd2')"> <br>
<input type = "button" value = ">>" name = "b4" onclick = "moveselect ('d1', 'd2', 1)"> <br>
</td>
<td align = "center" valign = "middle">
Сотрудники, ожидающие разделения отделов
<select size = "12" name = "d2" id = "d2" ondblclick = "moveselect (this, 'd1')" multy = "multy">
<option value = "Сотрудник x"> Сотрудник x </option>
<option value = "Работодатель y"> работодатель y </option>
</select>
</td>
</tr>
</table>
<a href = "javascript: void (0)" onclick = "guanbi ()"> подтвердить </a>
<input type = "кнопка" name = "кнопка" onclick = "guanbi ()" value = "Кнопка также может быть подтверждена">
</div>
<div id = "fade"> </div>
</body>
</html>
</body>
</html>
Я надеюсь, что эта статья будет полезна для каждого программирования JavaScript.