我正在开发一个不使用UpdatePanel
的交互式网络表单,因此我尝试使用JavaScript来完成大部分功能。对于这个问题,我试图弄清楚如何让java脚本将函数添加到PageLoad()的下拉列表中。
我有以下ASP文件:
<!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">
<head runat="server">
<title></title>
<script src="Default.js" type="text/javascript"></script>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.0/jquery.min.js" type="text/javascript"></script>
</head>
<body>
<form id="form1" runat="server">
<div>
Discovery Form Templates
<asp:DropDownList ID="uiFormTemplates" runat="server" DataTextField="Subject" DataValueField="DiscoveryFormID" AppendDataBoundItems="true" OnChange="GetTemplateValue();">
<asp:ListItem Text="--Select One--" Value=""/>
</asp:DropDownList>
</div>
<div id="ChangePlate"></div>
</form>
</body>
</html>
然后这个javascript:
function GetTemplateValue()
{
var dropdown = document.getElementById("uiFormTemplates");
var SelectedOption = dropdown.options[dropdown.selectedIndex].value;
if (SelectedOption == null) {
document.getElementById("ChangePlate").innerText = "There is nothing here.";
}
else {
document.getElementById("ChangePlate").innerText = dropdown;
}
}
我正在尝试使用以下javascript:
$(document).ready(function () {
$("#uiFormTemplates").onchange(function () { GetTemplateValue(); });
});
当我从OnChange="GetTemplateValue()"
中删除dropdownlist
时,即使使用第二种javascript方法也没有任何反应。我是否写错了代码,或者我是否从正确的角度来看这个问题?无论是代码批评还是某些方向现在都有用,我是js noob。
答案 0 :(得分:2)
假设您包含jQuery(您正在使用),则没有onchange
方法。您必须将其更改为on('change', ...)
,或使用change
方法。此外,#uiFormTemplates
不起作用,您必须使用控件的ClientID
所以:
$(document).ready(function () {
$("#<%= uiFormTemplates.ClientID %>").on('change', function () { GetTemplateValue(); });
});
或者:
$(document).ready(function () {
$("#<%= uiFormTemplates.ClientID %>").change(function () { GetTemplateValue(); });
});