У меня есть веб-страница, на которой я использую AJAX jQuery для загрузки новых элементов в div. Эта часть моей страницы отлично работает.
Теперь я хочу добавить подобное событие к этим вновь добавленным элементам. Для этого я планировал использовать метод jlu .live (), но ничего не произошло.
Так что я изначально начинаю с этого
<div id="change-agent-list" class="tooltip">
<div class="top"></div>
<div class="middle"></div>
<div class="bottom"></div>
</div>
В .middle Я асинхронно загружаю разметку, которая выглядит следующим образом:
<!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>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<title></title>
</head>
<body>
<form name="main" method="post" action="/ils/agent-selector/" id="main">
<div>
<input type="hidden" name="__VIEWSTATE" id="__VIEWSTATE" value="/wEPDwUKMTQ1MTc3ODM4NGRkg9mLyLiGNVcP/ppO9C/IbwpxdwI=" />
</div>
<ul id="content_0_agentsUL">
<li>
<a href="/agent-details/?ag={BF505982-DF16-4D09-BFE4-2ADDCADCC8E4}" class="agent-name link">Agent 1</a>
</li>
<li>
<a href="/agent-details/?ag={42F1AE01-59F4-43DE-98C7-A1F99DB3A33C}" class="agent-name link">Agent 2</a>
</li>
<li>
<a href="/agent-details/?ag={B3139686-12DA-44A1-A597-E05E1DD08007}" class="agent-name link">Agent 3</a>
</li>
</ul>
<div id="agent-details"></div>
</form>
</body>
</html>
Когда страница первоначально загружается, я использую этот скрипт - я собираюсь добавить обработчик кликов для каждого из элементов .agent-name , которые добавляются асинхронно позже.
$j(document).ready(function () {
$j(".agent-name").live("click", function() {
var agentDetails = $j(".agent-details");
var loadingContent = '<div id="ajax-load"><img src="/sitecore/__/_images/global/ajax-load.gif" alt="AJAX content loading" /></div>';
agentDetails.show();
agentDetails.empty().html(loadingContent);
var modalURL = $j(".agent-name").attr("href");
agentDetails.load(modalURL);*/
return false;
});
});
Проблема в том, что с элементами .agent-name не связаны никакие события. Я попытался заменить весь внутренний скрипт простым alert () , чтобы я мог видеть, связаны ли какие-либо события с элементами .agent-name , и я могу ' t alert () для отображения.
Другими словами, никакие события не связаны с моими .agent-name элементами.
Даже если я переместу класс agent-name в элементы списка и изменим jQuery на
$j(".agent-name").live("click", function() {
alert('1');
});
Я все равно ничего не получаю, когда нажимаю на элементы.
Может кто-нибудь объяснить, почему или как это исправить, чтобы я мог события позднего связывания с элементами, созданными в обратном вызове AJAX?