观看元素并更改文本的脚本
问题描述:
我使用引导可编辑来编辑照片的文本属性。在默认情况下,它显示文本,如果您单击它,将打开带有可编辑文本的小窗口。我想要做的就是创建一个脚本,它将用铅笔图标替换文本。我写了这个:观看元素并更改文本的脚本
$('#gallery').delegate('.editable-click', 'need_some_event' , function(){
$(this).text();
$(this).html('<i class="icon-pencil" ></i>');
}); //end delegate
的代码,我有:
<a class="edit editable editable-click" style="float:left; margin-right: 10px" href="#" rel="Photo_text_183" data-pk="183">some text descrtion of photo</a>
我想有后:
<a class="edit editable editable-click" style="float:left; margin-right: 10px" href="#" rel="Photo_text_183" data-pk="183"><i class="icon-pencil" ></i></a>
问题是,可编辑的文本是由另一个JavaScript生成。我基本上需要一些会观看所有可以点击的类元素的事件,如果它们出现,请删除带有图标的文本。感谢您的任何建议。
答
也许你可以尝试监听DOMNodeInserted
$(document).on('DOMNodeInserted', function(){
if($(this).find('.editable-text').length > 0){
//do stuff
}
});
这里的工作小提琴作为一个例子http://jsfiddle.net/wvVnQ/1/
因为,如下所述,这已被弃用,你可以试试这个插件:https://github.com/naugtur/insertionQuery
'DOMNodeInserted'在旧版浏览器上无法使用,并且很快就无法在较新的浏览器上使用,因为它已被W3C弃用。 – Alnitak 2013-03-23 20:51:54
好的,谢谢你,会试试 – kokoseq 2013-03-23 21:02:39
我用CSS做到了最后... .edit { \t text-indent:100%; white-space:nowrap; 溢出:隐藏; \t background-image:url(“../ img/glyphicons-halflings.png”); \t width:14px; height:14px; \t background-position:0 -72px; } – kokoseq 2013-03-23 21:23:41