Question

我正在处理我的第一个使用jQuery执行AJAX HTTP POST的HTML表单。当用户对输入文本字段和选项卡进行更改时，它会触发AJAX脚本，该脚本又调用执行数据库更新的PHP脚本。

我已经成功地为我的第一个输入字段工作了 - 我现在想将它扩展到第二个，第三个等输入字段，但是想要尝试避免使用多个执行非常类似功能的脚本。我是jQuery和AJAX的新手，所以我一边学习语法。

这是我的输入字段：

经理电话

这是我的Javascript，它正在处理storeManager输入字段：

<script type="text/javascript">
   $(document).ready(function() {
    $("#storeManager").change(function(){
        var storeManager = $("#storeManager").val();
        $.post('editProject.php', { storeManager: storeManager, id: '1E1DDA14-D2C6-4FC8-BA5F-DBCCC7ABAF7F' }, function(data) {
            $("#managerRow").addClass("success");

        }).fail(function () {
            // no data available in this context
            $("#managerRow").addClass("danger");
            $("#ajaxAlert").addClass("alert alert-danger");
        });
     }); 
});
</script>

我基本上需要分支并将另一个POST参数传递给editProject.php脚本，以便它知道要更新哪个数据库字段，然后有条件地将类添加到相应的行。

当我尝试将其分支或根据正在编辑的输入字段传递参数时，我尝试的所有内容都会破坏脚本。我无法找到任何显示正确语法的示例，以获得由不同输入字段调用的一个脚本 - 我认为这是可能的，而不是让同一脚本的多个版本作用于不同的字段。< / p>

Answer 1

你可以使用:input或class来做这样的事情

$(":input").on("change", function(){
    var text = $(this).val();
    var idOfInput = $(this).attr("id");

    //your post to php function using the above variables

});

从这里你可以使用id变量将idOfInput输入发布到你的php脚本，然后你可以在php端使用case switch来执行不同的查询将id发送到php

这是显示其工作原理的jsfiddle

Answer 2

您只是尝试发布一个值。例如type。其中应包含一些用于标识ajax调用的值。

如果是登录，请添加type = 'login'. Then check the value of $_POST['type'] and write php according to it

sample.php

if(isset($_POST['type']))
{
    if($_POST['type'] == 'login')
    {
        //your code goes here
    }
}

Answer 3

你可以使用这种代码：

$("#storeManager, #Manager, #Phone").change(function(){

Answer 4

这适用于多个字段。只需从不同的输入字段调用相同的函数。我把你的代码分成了两部分。 1.每个字段的onChange函数，和 2.通过传递字段参数调用函数。

<script type="text/javascript">
$(document).ready(function() {
$("#storeManager").change(function(){ yourFunction(this) }):

$("#worker").change(function(){ yourFunction(this) }):

$("#someX").change(function(){ yourFunction(this) }):

yourFunction(field)
{
    var value = $(field).val();
    var inputId=field.id;
    $.post('editProject.php', { inputValue: value, id: inputId }, function(data) {
        $('#'+inputId+'Row').addClass("success"); // (this looks like: *#storeManagerRow* ) you can change your Row id's accordingly to make your work easier. Eg: for **#storeManager** make this id as **storeManagerRow**

    }).fail(function () {
        // no data available in this context
        $('#'+inputId+'Row').addClass("danger");
        $("#ajaxAlert").addClass("alert alert-danger");
    });

});
</script>

从1个脚本中的多个输入字段调用jQuery AJAX

4 个答案: