. fadeout()在图像上似乎没有执行
.fadeOut() on a image doesn't seem to be executing
我有一个输入文本框。在用户从打字空闲后,我希望它提交表单(在下面的代码中工作)和一个复选标记的图像弹出,然后淡出。我只是想测试淡出功能,所以img是可见的,但我似乎不能让它工作。
var timer = null;
$('.form_timer').keyup(function()
{
if (timer) {
clearTimeout(timer);
}
var test = $(this);
timer = setTimeout(function() {
test.next('img').fadeOut('slow');
test.closest('form').submit();
}, 700);
});
:编辑# 1标记
<div class="accordion">
<div class="group">
<form accept-charset="UTF-8" action="/tasks/2" class="simple_form edit_task" data-remote="true" id="edit_task_2" method="post" novalidate="novalidate"><div style="margin:0;padding:0;display:inline"><input name="utf8" type="hidden" value="✓" /><input name="_method" type="hidden" value="put" /><input name="authenticity_token" type="hidden" value="Fil9PitLB6ZhHtWwBOehbOBkq2yE6qikN5cU0zr4wRQ=" /></div>
<h3><div class="input string optional"><label class="string optional control-label" for="name_2">Task Name</label><input class="string optional form_timer" id="name_2" name="task[name]" placeholder="New Task" size="50" type="text" value="somethingdd" /></div></h3>
<div>
<div class="input string optional" style="display: inline"><label class="string optional control-label" for="description_2">Description</label><input class="string optional form_timer" id="description_2" name="task[description]" size="50" type="text" value="blah123asdfgokkkkkasddadsdd" /></div><img alt="checkmark" class="form_checkmark" height="20px" src="/assets/checkmark.jpg" width="20px" />
</div>
</form>
</div>
</div>
用这个标记
<form method="get">
<textarea class="form_timer">type in here</textarea>
<img src="" width="200" height="150" style="display:block;background:#0c0;"/>
</form>
你的代码工作良好。您可以在这里测试http://jsfiddle.net/bukfixart/AvsUH/
更新了我的代码以使用parent then next。看来下一步和我预期的不一样。我仍然不喜欢这个作为一个解决方案,因为文本字段可能是两个层次深的div或等…
var timer = null;
$('.form_timer').keyup(function()
{
if (timer) {
clearTimeout(timer);
}
var test = $(this);
timer = setTimeout(function() {
test.parent().next('.form_checkmark').fadeOut('slow');
test.closest('form').submit();
}, 700);
});
我做了更多的挖掘看来我想要的东西没有简单的解决办法。找到了一个解决方案,别人张贴后,我知道我在寻找什么。在这里找到 相关文章:
- Div在单击图像时未执行slideTogle()
- jQuery:一旦加载了图像的子集,就执行函数
- 加载所有图像后执行代码
- 单击滑块图像以在javascript中执行一个函数
- 按钮被制作成一个图像来执行Javascript随机生成器
- 如何让javascript执行以更新图像
- 如何在AngularJS ngview中加载图像后执行foundation js调用
- 单击图像不执行任何操作
- 通过AjaxForm提交图像并执行回调
- 如何使用jQuery检查图像URL是否为空并执行某些操作
- 离子在加载所有图像和内容时执行操作
- Javascript - 在所有图像加载后执行
- 如果图像工作正常,为什么 img onerror 处理程序会执行
- jquery文档就绪侦听器与图像加载;执行顺序
- 在执行 h:命令链接操作时显示工作图像
- 在下载图像后或延迟一段时间后执行jQuery函数
- 可以在PHP图像渲染脚本上执行javascript
- 图像加载似乎会减慢Javascript的执行速度
- 在执行之前,请检查是否已加载子元素(图像)
- 使用carouFredSel执行图像更改函数