0

我有一个输入文本框。在用户打字空闲后,我希望它提交表单(在下面的代码中工作)和一个复选标记的图像以弹出然后淡出。我只是想测试淡出功能,所以 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);
});

:EDIT#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="&#x2713;" /><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>        
4

2 回答 2

0

有了这个标记

<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/

于 2013-01-02T16:55:43.007 回答
0

更新了我的代码以使用父级然后下一个。似乎 .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);
});

EDIT#1 做了更多的挖掘看起来我想要的没有一个简单的解决方案。在我知道我在寻找什么之后,找到了其他人发布的解决方案。在这里找到

于 2013-01-02T17:38:56.800 回答