关于动态内容的更改没有触发的Jquery
我正在尝试使用所有动态元素创建级联下拉列表。
我的Html：
我有2个函数使用ajax加载元素，两者都正常工作：
function GetSites() { $.ajax({ url: '/Sites/GetSites', dataType: "json", type: "POST", error: function () { alert("An error ocurred."); }, success: function (data) { var items = ""; $.each(data, function (i, item) { items += "" + item.Text + ""; }); $("#Sites").html(items); } }); } function GetSectors(siteId) { $.ajax({ url: '/Sites/GetSectors', data: { siteId: siteId }, dataType: "json", type: "POST", error: function () { alert("An error ocurred."); }, success: function (data) { var items = ""; $.each(data, function (i, item) { items += "" + item.Text + ""; }); $("#Sectors").html(items); } }); }
我需要根据站点选择调用GetSectors。 我有这个：
$(document).ready(function () { $("#Sites").on("change", function (e) { var siteId = $("#Sites").val(); GetSectors(siteId); }); GetSites(); });
但它不起作用。 我正在使用jquery 1.8.3。
任何想法问题在哪里？
谢谢！
尝试事件委派 ：
$(document).on("change", "#Sites", function(){ var siteId = this.value; GetSectors(siteId); });
事件的冒泡行为允许我们执行“事件委托” – 将处理程序绑定到高级元素，然后检测哪个低级元素启动了事件。
活动授权有两个主要好处。 首先 ，它允许我们绑定比我们必须绑定更少的事件处理程序 ，如果我们听取单个元素的点击，这可以是一个很大的性能增益 。 其次 ，它允许我们绑定到父元素 – 例如无序列表 – 并且知道我们的事件处理程序将按预期触发，即使该父元素的内容发生更改。
摘自： http ： //jqfundamentals.com/chapter/events
委托事件的优点是， 它们可以处理来自稍后添加到文档的后代元素的事件。 通过选择在附加委托事件处理程序时保证存在的元素，您可以使用委派事件来避免频繁附加和删除事件处理程序。 例如，此元素可以是模型 – 视图 – 控制器设计中视图的容器元素，如果事件处理程序想要监视文档中的所有冒泡事件，则可以是文档。 在加载任何其他HTML之前，文档元素在文档的头部可用， 因此可以安全地将事件附加到那里而无需等待文档准备就绪。
摘自： http ： //api.jquery.com/on/