jQuery结合HTML表单重定向问题：PHP表单修改后跳转报错排查

你遇到的这个语法错误，根源在于AJAX请求的data参数格式写错了。咱们来拆解一下问题：

错误原因 #

你的原代码里，data部分试图用对象字面量包裹，但里面却写了一串字符串拼接的查询字符串——这完全不符合JavaScript对象的语法规则。对象的键值对应该是key: value的形式，而你把'abv=' + abreviation + ...当成了一个键，这里的+号在对象键的位置是不合法的，所以浏览器抛出了Unexpected token '+'的错误。

原错误代码片段：

data: { 'abv=' + abreviation + '&descr=' + description + '&lg=' + largeur + '&ht=' + longueur },

正确的写法（两种可选） #

方式一：使用对象字面量（推荐） #

这是jQuery AJAX最常用的写法，jQuery会自动帮你处理参数的编码和格式转换，省心又不容易出错：

$("#linktest").click(function(event) { 
    $.ajax({ 
        url: './testsql.php', 
        data: { 
            abv: abreviation, 
            descr: description, 
            lg: largeur, 
            ht: longueur 
        }, 
        type: 'POST', 
        dataType: 'json', 
        success: ajax_success, 
        error: function(code, status, error) { 
            console.log('code : ' + code + '\n' + 'status : ' + status + '\n' + 'error : ' + error); 
        } 
    }); 
});

注意：要确保abreviation、description等变量已经正确定义并获取到了页面表单的输入值。

方式二：直接传字符串格式的参数 #

如果你一定要手动拼接参数字符串，那不要用对象包裹，直接传字符串即可，同时要记得对参数值做URL编码（避免特殊字符导致的问题），并且把HTML实体&换成JS里的&：

$("#linktest").click(function(event) { 
    $.ajax({ 
        url: './testsql.php', 
        data: 'abv=' + encodeURIComponent(abreviation) + 
              '&descr=' + encodeURIComponent(description) + 
              '&lg=' + encodeURIComponent(largeur) + 
              '&ht=' + encodeURIComponent(longueur), 
        type: 'POST', 
        dataType: 'json', 
        success: ajax_success, 
        error: function(code, status, error) { 
            console.log('code : ' + code + '\n' + 'status : ' + status + '\n' + 'error : ' + error); 
        } 
    }); 
});

额外注意事项 #

1. 检查你的代码末尾，原代码最后多了一个});，要确保语法闭合正确，避免额外的语法错误。
2. 在testsql.php中，记得用$_POST['abv']、$_POST['descr']等方式接收参数，并且一定要做好SQL注入防护（比如使用预处理语句，不要直接拼接SQL字符串）。

内容的提问来源于stack exchange，提问作者Grégory Pyck