JQuery 中的更改和键入事件处理程序答案

【问题标题】：Change and Keyup Event Handler in JQueryJQuery 中的更改和键入事件处理程序
【发布时间】：2009-06-16 07:15:28
【问题描述】：

我在我的应用程序中使用 JQuery、CakePHP 和 Mysql。我有一个类似下面的代码，其中的说明是一个文本框，当我输入它时，它将显示在显示面板中。

$(".TextFieldSettings #instructions").keyup(function (){
  instr=$(".TextFieldSettings #instructions").val();
  $("#displayPanel .fieldInstructions"+counter).html(instr).show();
});//Text field instructions keyup

此代码运行良好。

编辑：如果我更改文本框说明中的值，则 keyup 值必须显示在显示面板中。同时，我需要将 instr 中的最终更改值插入数据库。我该怎么做？

【问题讨论】：

你能澄清你在问什么吗？我很难跟上...
我同意保罗的观点。您是在问如何将数据插入到数据库中？

标签： javascript jquery mysql cakephp

【解决方案1】：

您可以延迟您的操作：

$(".TextFieldSettings #instructions").keyup(function (){
  setTimeout(function () {
    var instr=$(".TextFieldSettings #instructions").val();
    $("#displayPanel .fieldInstructions"+counter).html(instr).show();
  }, 1);
});//Text field instructions keyup

这样，当函数执行时，输入的值已经被按键更新了。

【讨论】：

【解决方案2】：

根据您的指令包含多少内容/按键频率，我认为每次按键都更新数据库有点矫枉过正。也许每 5 秒更新一次数据库或什么？每次按键触发/重置一个 setTimeout 函数。

另外，您可以用 $(this); 替换您的调用以提取文本值；

$(".TextFieldSettings #instructions").keyup(function (){
    var instr = $(this).val();
    $("#displayPanel .fieldInstructions"+counter).html(instr).show();

    // Update database
    $.ajax({ 
              method: 'POST', 
              url: 'path/to/a/script_file/executing_the_sql.ext',
              data: { 'str': escape(instr.replace(/\n/g,'<br />')) },
              success: function(){},
              error: function(e){ alert(e.responseText); }
    });

});//Text field instructions keyup

【讨论】：