当前位置：文江博客话题详情

如何提交表单 onkeyup 操作

发布于 2024-09-29 23:06:34 字数 126 浏览 4 评论 0原文

我正在尝试保存表单 onkeyup 操作。我是 jQuery 新手。

这可能吗？

我很感激任何帮助。

编辑1：保存表单意味着保存到服务器。有没有办法增加0.2秒的延迟。

原文

分享到QQ

分享到微博

如果你对这篇内容有疑问，欢迎到本站社区发帖提问参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

发布评论

需要登录才能够评论，你可以免费注册一个本站的账号。

狼性发作 2024-10-06 23:06:34

这段代码将在 keyup 上提交您的表单

$('#element').bind('keyup', function() { 
    $('#form').delay(200).submit();
});

在这段代码中，您拦截表单提交并使用 ajax 提交更改

$("#form").submit(function (event) {
    event.preventDefault();
    $.ajax({
        type: "post",
        dataType: "html",
        url: '/url/toSubmit/to',
        data: $("#form").serialize(),,
        success: function (response) {
            //write here any code needed for handling success         }
    });
});

它要使用延迟功能，您应该使用 jQuery 1.4。传递给delay的参数以毫秒为单位。

This code will submit your form on keyup

$('#element').bind('keyup', function() { 
    $('#form').delay(200).submit();
});

In this code you intercept the form submit and change it with an ajax submit

$("#form").submit(function (event) {
    event.preventDefault();
    $.ajax({
        type: "post",
        dataType: "html",
        url: '/url/toSubmit/to',
        data: $("#form").serialize(),,
        success: function (response) {
            //write here any code needed for handling success         }
    });
});

To use the delay function you should use jQuery 1.4. The parameter passed to delay is in milliseconds.

回复收藏 0 原文

ゝ杯具 2024-10-06 23:06:34

来自此 jQuery 论坛主题：

$('#element').bind('keyup', function() { $('#form').submit(); } );

From this jQuery forum thread:

$('#element').bind('keyup', function() { $('#form').submit(); } );

回复收藏 0 原文

鹤仙姿 2024-10-06 23:06:34

这是我的解决方案：

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="pt-br" lang="pt-br">
<head><title>Submit after typing finished</title>
<script language="javascript" type="text/javascript">
function DelayedSubmission() {
    var date = new Date();
    initial_time = date.getTime();
    if (typeof setInverval_Variable == 'undefined') {
            setInverval_Variable = setInterval(DelayedSubmission_Check, 50);
    } 
}
function DelayedSubmission_Check() {
    var date = new Date();
    check_time = date.getTime();
    var limit_ms=check_time-initial_time;
    if (limit_ms > 800) { //Change value in milliseconds
        alert("insert your function"); //Insert your function
        clearInterval(setInverval_Variable);
        delete setInverval_Variable;
    }
}

</script>
</head>
<body>

<input type="search" onkeyup="DelayedSubmission()" id="field_id" style="WIDTH: 100px; HEIGHT: 25px;" />

</body>
</html>

This is my solution:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="pt-br" lang="pt-br">
<head><title>Submit after typing finished</title>
<script language="javascript" type="text/javascript">
function DelayedSubmission() {
    var date = new Date();
    initial_time = date.getTime();
    if (typeof setInverval_Variable == 'undefined') {
            setInverval_Variable = setInterval(DelayedSubmission_Check, 50);
    } 
}
function DelayedSubmission_Check() {
    var date = new Date();
    check_time = date.getTime();
    var limit_ms=check_time-initial_time;
    if (limit_ms > 800) { //Change value in milliseconds
        alert("insert your function"); //Insert your function
        clearInterval(setInverval_Variable);
        delete setInverval_Variable;
    }
}

</script>
</head>
<body>

<input type="search" onkeyup="DelayedSubmission()" id="field_id" style="WIDTH: 100px; HEIGHT: 25px;" />

</body>
</html>

回复收藏 0 原文

半岛未凉 2024-10-06 23:06:34

只需生成一个小脚本（此解决方案使用裸 JavaScript）：

<script>
    document.getElementById('idOfTheInputField').addEventListener('keyup', function() {
        setTimeout(function() {
            document.getElementById('idOfTheForm').dispatchEvent(new Event('submit'));
        }, 200);
    });
</script>

其中：

document.getElementById('idOfTheInputField')：这会检索 ID 为“idOfTheInputField”的 DOM 元素。
addEventListener('keyup', function() { ... })：这会将 'keyup' 事件侦听器附加到上面检索到的元素。
setTimeout(function() { ... }, 200)：这会将内部函数的执行延迟 200 毫秒。
document.getElementById('idOfTheForm').dispatchEvent(new Event('submit'))：这会触发 ID 为“idOfTheForm”的表单上的“submit”事件。

Just generate a little script (this solution uses bare javascript):

<script>
    document.getElementById('idOfTheInputField').addEventListener('keyup', function() {
        setTimeout(function() {
            document.getElementById('idOfTheForm').dispatchEvent(new Event('submit'));
        }, 200);
    });
</script>

Where:

document.getElementById('idOfTheInputField'): This retrieves the DOM element with the ID 'idOfTheInputField'.
addEventListener('keyup', function() { ... }): This attaches a 'keyup' event listener to the element retrieved above.
setTimeout(function() { ... }, 200): This delays the execution of the inner function by 200 milliseconds.
document.getElementById('idOfTheForm').dispatchEvent(new Event('submit')): This triggers the 'submit' event on the form with the ID 'idOfTheForm'.

回复收藏 0 原文

~没有更多了~