http://bec-systems.com/list-click.html
列表中的第一个条目触发单击事件.但是,如果通过按“刷新更新列表”按钮动态添加3个事件,则接下来的3个列表条目不会生成单击事件.
感谢关于如何使这项工作或通常改进代码的任何建议.
谢谢,
悬崖
代码也列在下面:
<!DOCTYPE HTML> <HTML> <head> <Title>Status</Title> <Meta name="vIEwport" content="wIDth=device-wIDth,initial-scale=1"> <link rel="stylesheet" href="http://code.jquery.com/mobile/1.1.1/jquery.mobile-1.1.1.min.CSS" /> <script src="http://code.jquery.com/jquery-1.7.1.min.Js"></script> <script src="http://code.jquery.com/mobile/1.1.1/jquery.mobile-1.1.1.min.Js"></script> <script type="text/JavaScript">$(document).ready(function() { $("#refreshUpdatebutton").on("click",function(event,ui) { console.log("refreshUpdatebutton") versions = ["0.3","0.4","0.5"] for (var i=0; i < versions.length; i += 1) { $("#updateVersionsList").append('<li><a ID="updateVersionItem-' + (i+3) + '">' + versions[i] + '</a></li>'); if ($("#updateVersionsList").hasClass('ui-ListvIEw')) { $("#updateVersionsList").ListvIEw("refresh"); } else { $("#updateVersionsList").trigger('create'); } } }) $('[ID^=updateVersionItem]').on("click",ui) { console.log("updateVersion,selected = " + $(this).attr('ID')); })}); </script></head> <body> <!-- Software update page --><div data-role="page" ID="software-update-page"> <div data-role="header"> <h1>Software Update</h1> </div><!-- /header --> <div data-role="content"> <h1>Select Software version:</h1> <ul data-role="ListvIEw" ID="updateVersionsList"> <li><a ID="updateVersionItem-0">0.0</a></li> <li><a ID="updateVersionItem-1">0.1</a></li> <li><a ID="updateVersionItem-2">0.2</a></li> </ul> <br> <a data-role="button" ID="refreshUpdatebutton">Refresh Update List</a> </div><!-- /content --></div></body></HTML>解决方法 使用这种形式的.on()(以下评论).
$(document).on("click",'[ID^=updateVersionItem]',selected = " + $(this).attr('ID')); })
示例:http://jsfiddle.net/saluce/YaAEJ/
否则,无论何时动态添加新元素,都需要将click事件附加到这些项目.
假设以下代码:
function doThisOnClick(event,selected = " + $(this).attr('ID'));}$('[ID^=updateVersionItem]').on("click",doThisOnClick);
您可以取消绑定处理程序并重新附加到所有匹配项:
$('[ID^=updateVersionItem]').off("click",doThisOnClick);$('[ID^=updateVersionItem]').on("click",doThisOnClick);
或者只需在添加后将其动态添加到新项目中:
$("#updateVersionsList").append('<li><a ID="updateVersionItem-' + (i+3) + '">' + versions[i] + '</a></li>').on("click",doThisOnClick);总结
以上是内存溢出为你收集整理的html – jQuery Mobile点击动态列表项上的事件全部内容,希望文章能够帮你解决html – jQuery Mobile点击动态列表项上的事件所遇到的程序开发问题。
如果觉得内存溢出网站内容还不错,欢迎将内存溢出网站推荐给程序员好友。
欢迎分享,转载请注明来源:内存溢出
评论列表(0条)