При выполнении JavaScript после того, как было установлено выбранное значение управления
Причины, почему селекторы на основе id не работают
- Элемент / DOM с указанным идентификатором еще не существует.
- Элемент существует, но он не является зарегистрированный в DOM [в случае, если HTML-узлы динамически добавляются из ответов Ajax].
- Присутствует более одного элемента с тем же идентификатором, который вызывает конфликт.
Решения
- Попробуйте получить доступ к элементу после его объявления или, альтернативно, использовать такие вещи, как
$(document).ready(); - . Для элементов, исходящих из ответов Ajax, используйте метод
.bind()для jQuery. В старых версиях jQuery для этого было.live(). - Используйте инструменты [например, плагин webdeveloper для браузеров], чтобы найти дубликаты идентификаторов и удалить их.
2 ответа
<%@ Page Language="C#" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<script runat="server">
protected void indexChanged(object sender, EventArgs e)
{
Label1.Text = " I did something! ";
}
</script>
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title>Test Page</title>
</head>
<body>
<script type="text/javascript">
function firstChanged() {
if(document.getElementById("firstSelect").selectedIndex != 0)
document.getElementById("secondSelect").disabled = false;
else
document.getElementById("secondSelect").disabled = true;
}
</script>
<form id="form1" runat="server">
<div>
<select id="firstSelect" onchange="firstChanged()">
<option value="0"></option>
<option value="1">One</option>
<option value="2">Two</option>
<option value="3">Three</option>
</select>
<select id="secondSelect" disabled="disabled">
<option value="1">One</option>
<option value="2">Two</option>
<option value="3">Three</option>
</select>
<asp:DropDownList ID="DropDownList1" AutoPostBack="true" OnSelectedIndexChanged="indexChanged" runat="server">
<asp:ListItem Text="One" Value="1"></asp:ListItem>
<asp:ListItem Text="Two" Value="2"></asp:ListItem>
</asp:DropDownList>
<asp:Label ID="Label1" runat="server"></asp:Label>
</div>
</form>
<script type="text/javascript">
window.onload = function() {firstChanged();}
</script>
</body>
</html>
Править: Замененный целый код. Это должно работать даже в Вашем пользовательском элементе управления. Я верю тому Регистру. ClientScriptBlock не работает, потому что код, который Вы пишете в том блоке, выполнен, прежде чем window.onload называют. И, я принимаю (я не уверен в этой точке), что Объектам DOM не установили их значения в то время. И, это - то, почему Вы получаете selectedIndex как всегда 0.
Если второе выпадающее первоначально включено через JavaScript (я предполагаю, что это во время JavaScript onchange, так как Вы не указывали), то нажатие на кнопку "Назад" для перезагрузки предыдущей обратной передачи никогда не будет включать его.
Смешивание ASP.NET с классическим JavaScript может быть волосатым. Вы могли бы хотеть взглянуть на реализацию Ajax ASP.NET (или стороннее управление AjaxPanel, если Вы вынуждены использовать более старую версию ASP.NET). Они дадут Вам поведение, которое Вы хотите через чистый C#, не вынуждая Вас обратиться к хакерству-pokery JavaScript.