我目前正在尝试使用 YUI3 集成 Spring mvc 应用程序。我能够通过 YUI 在 jsp 中使用静态 href 调用 Spring 控制器，但是在尝试调用动态生成的 href 时没有调用脚本。
<script src="http://yui.yahooapis.com/3.14.1/build/yui/yui-min.js"></script>
<script>
YUI().use('io-form', 'json','datatable','node','tabview',function(Y) {
Y.all('#nav a').on('click', function (ev) {
ev.preventDefault();
//main.load(ev.target.get('href'), '#content');
var href = ev.target.get('href');
var url = href.substring(0,href.indexOf('#'));
var idw = href.substring(href.indexOf('#')+1,href.length);
Y.io(url, {
method: 'GET',
on: {
complete: function(id, response) {
answer = Y.JSON.parse(response.responseText);
Y.log(answer);
var main = Y.one('#'+idw);
var node = main.all('li');
if(node.size()===0){
Y.Object.each(answer, function(item, index){
main.append("<li id='"+item+"' class='api-list-item class'><a href='/YUI-2-Spring/getContactDetails/"+item+".html#"+item+"'>"+item+"</a></li>");
});
}
}
}
});
});
//To call controller on clickin of dynamic links
Y.all('#api-Types a').on('click', function (ev) {
ev.preventDefault();
//main.load(ev.target.get('href'), '#content');
var href = ev.target.get('href');
var neturl = href.substring(0,href.indexOf('#'));
var studId= href.substring(href.indexOf('#')+1,href.length);
Y.io(neturl, {
method: 'GET',
on: {
complete: function(id, response) {
answer = Y.JSON.parse(response.responseText);
Y.log(answer);
var main = Y.one('#api-everything');
var node = main.all('li');
if(node.size()===0){
Y.Object.each(answer, function(item, index){
main.append("<li id='"+item+"' class='module-class'><a href='/YUI-2-Spring/getPersonalDetails/"+item+"/"+contId+"'</a>"+item+"</li>");
});
}
}
}
});
});
});
</script>
我用于在选项卡视图选择上调用控制器的第一个脚本。基于此，我正在创建一个<ul id="api-Types" class="apis modules"></ul>字段中带有 href 的字符串列表。在下一个脚本中，我尝试调用生成的链接，但脚本未执行。
<div class="yui3-u-1-4">
<div id="docs-sidebar" class="sidebar apidocs">
<div id="api-list">
<h2 class="off-left">APIs</h2>
<div id="api-tabview" class="yui3-tabview-content">
<ul id="nav" class="tabs">
<li class="yui3-tab yui3-widget yui3-tab-selected"><a href="/YUI-2-Spring/getAllElements.html#api-elements">Elements</a></li>
<li class="yui3-tab yui3-widget"><a href="/YUI-2-Spring/getContactDetails.html#api-Types">Contact Details</a></li>
<li class="yui3-tab yui3-widget"><a href="#api-everything">All</a></li>
</ul>
<div id="yui3-tabview-panel">
<ul id="api-elements" class="apis classes">
<input type="search" id="api-filter" placeholder="Type to filter APIs">
</ul>
<ul id="api-Types" class="apis modules">
<input type="search" id="api-filter" placeholder="Type to filter APIs"></ul>
<ul id="api-everything" class="apis search">
<input type="search" id="api-filter" placeholder="Type to filter APIs">
<li class="message">
Begin typing in the search box above to see results.
</li>
</ul>
</div>
</div>
</div>
这是从视图源代码生成的动态列表：
<ul id="api-Types" class="apis modules yui3-tab-panel yui3-tab-panel-selected" role="tabpanel" aria-labelledby="yui_3_14_1_1_1389513296688_62">
<input type="search" id="api-filter" placeholder="Type to filter APIs"><li class="api-list-item class"><a href="/YUI-2-Spring/getContactDetails/ABC.html#ABC" id="yui_3_14_1_1_1389513296688_227">ABC</a></li><li id="BCD" class="api-list-item class"><a href="/YUI-2-Spring/getContactDetails/BCD.html#BCD">BCD</a></li><li id="CDE" class="api-list-item class"><a href="/YUI-2-Spring/getContactDetails/CDE.html#CDE">CDE</a></li><li id="DEF" class="api-list-item class"><a href="/YUI-2-Spring/getContactDetails/DEF.html#DEF">DEF</a></li><li id="EFG" class="api-list-item class"><a href="/YUI-2-Spring/getContactDetails/EFG.html#EFG">EFG</a></li><li id="FGH" class="api-list-item class"><a href="/YUI-2-Spring/getContactDetails/FGH.html#FGH">FGH</a></li></ul>
当我单击链接时，我的控制器不是调用脚本，而是通过调度程序 servlet 调用。 任何帮助将不胜感激。
要在 DOM 上动态添加的元素上绑定事件，您应该使用"委托"而不是"on"来绑定事件。它会起作用。