[英]jquery mouseenter is not working on img
我试图将图像拖到jquery文本编辑器(jqte),然后在编辑器中调整其大小。 由于调整大小功能仅在Firefox中有效。 所以我想在mouseenter上提供W和H文本框来更改大小。 但是mouseenter不适用于img元素。
<div class="jqte_editor" contenteditable="true"><pre style="font-family:consolas;">
<br>
<img style="border-left-width: 1px; border-left-style: solid; border-left-color: rgb(255, 255, 255); border-bottom-width: 1px; border-bottom-style: solid; border-bottom-color: rgb(255, 255, 255);" src="http://localhost:65380/Articles/ArticleImageStore/cf82c9c8-3ea0-4c7f- 9272-7b2fd48a9eed/79825f3f-965f-4e34-ad45-3fa7430e6837.JPEG" width="64" height="64" id="img6">
</pre>
<p><br></p>
<pre style="font-family:consolas;"> </pre> <p></p>
</div>
jQuery代码段
$('.jqte_editor img').on('mouseenter', function() {
alert("hello");
$(this).before("<div style='position:absolute'><input type='textbox'></input></div>");
});
您的代码在这里工作
您可能没有包含必需的jQuery library
,此链接显示了jQuery的工作方式,或者没有将事件绑定放入document.ready中 。
添加jQuery
<script src="http://code.jquery.com/jquery-latest.min.js"
type="text/javascript"></script>
在document.ready中的绑定事件
$(document).ready(function(){
$('.jqte_editor img').on('mouseenter', function() { alert("hello"); $(this).before("<div style='position:absolute'><input type='textbox'></input></div>"); });
});
您的代码运行正常: http : //jsfiddle.net/ANnH2/
如果您没有将代码包装在.ready函数中,请检查一下:
$(document).ready(function(){
$('.jqte_editor img').on('mouseenter', function() {
alert("hello");
$(this).before("<div style='position:absolute'><input type='textbox'></input></div>");
});
});
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.