不按键发送和trunc变量（在Ajax和PHP之间切换）_Php_Ajax_Post_Get_Onchange

不按键发送和trunc变量（在Ajax和PHP之间切换）

php ajax post

不按键发送和trunc变量（在Ajax和PHP之间切换）,php,ajax,post,get,onchange,Php,Ajax,Post,Get,Onchange,在开始编写代码之前，我试图解释我想要实现的目标：我有一个输入，用户将使用带有键盘模拟的条形码阅读器编写一个代码（条形码），因此他将编写类似于：123465789的内容我想把这些数字都记下来截断它们，因为我只需要前4个字符：1234 将此值传递给db，db将检查哪个项目对应于此数字添加到项目的“库存”编号清理表格尽可能快地重复好了，现在我试着解释一下，让我们从有趣的部分开始，我的代码：文件1:change.php <!DOCTYPE html> <html>

在开始编写代码之前，我试图解释我想要实现的目标：

我有一个输入，用户将使用带有键盘模拟的条形码阅读器编写一个代码（条形码），因此他将编写类似于：123465789的内容

我想把这些数字都记下来

截断它们，因为我只需要前4个字符：1234

将此值传递给db，db将检查哪个项目对应于此数字

添加到项目的“库存”编号

清理表格

尽可能快地重复

好了，现在我试着解释一下，让我们从有趣的部分开始，我的代码：

文件1:change.php

<!DOCTYPE html>
<html>
<head>
  <style>
fieldset { margin-bottom: 1em; }
input { display: block; margin-bottom: .25em; }
#print-output {
  width: 100%;
}
.print-output-line {
  white-space: pre;
  padding: 5px;
  font-family: monaco, monospace;
  font-size: .7em;
}

</style>
  <script src="http://code.jquery.com/jquery-latest.js"></script>
</head>
<body>
  <form>
  <fieldset>
    <label for="troncami">Type Something:</label>
    <input id="troncami" type="text" />
  </fieldset>
</form>
<div id="risultatotroncato"></div>
<script>
$('#troncami').keyup(function(event) {              


            var str = $(this).serialize();                   
               $.ajax({            
               type: "GET", // the kind of data we are sending
               url: "troncare.php", // this is the file that processes the form data
               data: str, // this is our serialized data from the form
               success: function(msg){  // anything in this function runs when the data has been successfully processed

                    // this sets up our notification area for error / success messages
                    $("#risultatotroncato").ajaxComplete(function(event, request, settings)
                    { 
                        result = msg; // msg is defined in sendmail.php
                        $(this).html(result); // display the messages in the #note DIV                           
                    }); 
                $('input[name=troncami]').val(msg);
                }                    
             });                     



}).keydown(function(event) {
  if (event.which == 13) {
    event.preventDefault();
  }  
});

$('#other').click(function() {
  $('#target').keyup();
});</script>

</body>
</html>


字段集{margin bottom:1em；}
输入{显示：块；页边距底部：.25em；}
#打印输出{
宽度：100%；
}
.打印输出行{
空白：预处理；
填充物：5px；
字体系列：摩纳哥，monospace；
字体大小：.7em；
}
键入以下内容：
$（'#troncami'）.keyup（函数（事件）{
var str=$（this.serialize（）；
$.ajax（{
键入：“GET”，//我们正在发送的数据类型
url:“troncare.php”，//这是处理表单数据的文件
data:str，//这是表单中的序列化数据
success:function（msg）{//成功处理数据后，此函数中的任何内容都会运行
//这将设置错误/成功消息的通知区域
$（“#risultatotroncato”）.ajaxComplete（功能（事件、请求、设置）
{ 
result=msg；//msg在sendmail.php中定义
$（this.html（result）；//在#note DIV中显示消息
}); 
$（'input[name=troncami]'）.val（msg）；
}                    
});                     
}).keydown（功能（事件）{
if（event.which==13）{
event.preventDefault（）；
}  
});
$（“#其他”）。单击（函数（）{
$（'#target'）.keyup（）；
});

文件2:troncare.php

<?php
$risultatotroncato = 0;

$risultatotroncato = substr ($_GET['troncami'],0,4);

echo $risultatotroncato;
?>

很明显，它不起作用。我唯一能看到的是一个通知错误：

注意：未定义索引：troncami in 第6行的D:\Locali\xampp\htdocs\combobox\troncare.php

因此，我的问题是如何将输入中写入的值传递到$\u GET/$\u POST，以便能够使用“troncare.php”对其进行“管理”？我如何才能尽可能快地完成此操作，以便用户能够在不停止的情况下使用条形码扫描仪进行“拍摄”，并几乎“实时”地将值保存在数据库中？多谢各位

（您可能已经知道，我仍在学习PHP、AJAX和jQuery，因此在几年/几个月后，我将能够自己完成这项工作，但……我需要尽快完成，您能帮我吗？

要回答您的主要问题，只需将GET参数添加到您在AJAX调用中调用的URL的末尾即可。大致如下：

$.ajax({             
    type: "GET", // the kind of data we are sending 
    url: "troncare.php?troncami=" + $('#troncami').val(), // this is the file that processes the form data 
    success: function(msg){  // anything in this function runs when the data has been successfully processed 
        // this sets up our notification area for error / success messages 
        $("#risultatotroncato").ajaxComplete(function(event, request, settings) {  
            result = msg; // msg is defined in sendmail.php 
            $(this).html(result); // display the messages in the #note DIV                            
        });  
        $('#troncami').val(msg); 
    }                     
});

或者，您可以使用$.ajax调用的值以键/值对的形式传递：

$.ajax({             
    type: "GET", // the kind of data we are sending 
    url: "troncare.php", // this is the file that processes the form data 
    data: {"troncami" : $('#troncami').val()}, // this is our serialized data from the form 
    success: function(msg){  // anything in this function runs when the data has been successfully processed 
        // this sets up our notification area for error / success messages 
        $("#risultatotroncato").ajaxComplete(function(event, request, settings) {  
            result = msg; // msg is defined in sendmail.php 
            $(this).html(result); // display the messages in the #note DIV                            
        });  
        $('#troncami').val(msg); 
    }                     
});

请注意，我使用了“#troncami”而不是“input[name=troncami]”作为输入的选择器。虽然这看起来很简单，但在很大程度上，使用元素的ID作为选择器比使用过滤器样式选择器更重要。ID在页面中应该是唯一的，以便在DOM中快速找到对象。如果使用过滤器样式选择器（如“input[name=troncami]”），则必须首先找到对象。您还应该考虑在Ajax／JSON调用中使用回调参数，因为这些可以帮助避免跨站点脚本（XSS）。另一方面，我希望您在ajax调用的接收端执行一些数据验证和清理。正如您的代码现在一样，它非常容易受到注入攻击。至少在您的情况下，我会在troncare.php中使用类似的内容来验证输入值，然后再查询或插入数据库：

<?php
$risultatotroncato = 0;

if (isset($_GET['troncami']) && ctype_digit($_GET['troncami'])) {
    $risultatotroncato = substr ($_GET['troncami'],0,4);
    //echo or search the database here
}
else {
    //do whatever here if the value is blank or contains invalid characters
}
?>

这确保接收的值只能是数字（1234567890）

更新：

如果我在本例中正确理解了您的情况，troncare.php应接收的值应始终仅为数字（如果该值有效），因此php函数将足以清除数据，并且仅当该值仅包含数字时才会返回true。在这种情况下，这就足够了。如果您允许使用字母或数字，还有其他几种方法可以提供帮助。如果数据是非标准类型，则可以使用使用模式匹配的preg_匹配。在所有其他情况下，通常会有一个PHP函数与数据库类型匹配，用于清理数据。例如，如果您使用的是MySQL，则有一个名为mysqli_real_escape_string（）的PHP函数，以及MySQL_real_escape_string（）函数，它在以任何方式将数据用于数据库之前对数据进行清理。我不会在这个部门重新发明轮子，但在SO（以及web上的其他地方）上有很多关于这个主题的好问题，例如：

非常感谢您的回答，第一个有效，但第二个无效，总之，您知道在执行php后如何清理输入吗？