Question

我正在使用javascript和ajax的多个复选框。当单击复选框时，javascript将带有ajax的值发送到trata.php（这些值：检查是否为true或false以及该复选框的id）...但是id总是显示我未定义....可以指导我，拜托。

这是JS：

$("div.feature").click(function() {
    var checked = $(this).is(':checked');
    var Id = $(this).attr('id');
    var data = "Cara=" + checked + "&Id=" + Id;
    $.ajax({
        type: "POST",
        url: "trata.php?ts=" + new Date().getTime(),
        data: data,
        cache: false,
        beforeSend: function() {
            $("#tr").show();
            $("#t").empty();
        },
        success: function(response) {
            $("#tr").hide();
            $("#t").append(response);
        }
    })
    return false;
});

$("div.feature1").click(function() {
    var checked = $(this).is(':checked');
    var Id = $(this).attr('id');
    var data = "Pieza=" + checked + "&Id=" + Id;
    $.ajax({
        type: "POST",
        url: "trata.php?ts=" + new Date().getTime(),
        data: data,
        cache: false,
        beforeSend: function() {
            $("#tr").show();
            $("#t").empty();
        },
        success: function(response) {
            $("#tr").hide();
            $("#t").append(response);
        }
    })
    return false;
});

在页面中，这是代码：

<table>
    <tr>
        <td>
            <div class="feature" align="center">
                <input type="text" value="<?php echo $row['Id'] ?>" name="Id" id="Id" /> <!-- in this Id the value is 1 -->
                <input type="checkbox" data-no-uniform="true" class="iphone-toggle" <?php if ($row[ 'Cara']=='1' ) {echo 'name="Cara" value="on"  checked="checked"';} else { echo 'name="Cara" value="off"'; } ?>>
            </div>
            <div id="tr" style="display:none;" align="center"><img src="img/ajax-loaders/ajax-loader-1.gif" />
            </div>
            <div id="t"></div>
        </td>
        <td>
            <div class="feature1" align="center">
                <input type="text" value="<?php echo $row['Id']; ?>" name="Id" id="Id" /> <!-- in this Id the value is 2 -->
                <input type="checkbox" data-no-uniform="true" class="iphone-toggle" <?php if ($row[ 'Pieza']=='1' ) {echo 'name="Pieza" value="on"  checked="checked"';} else { echo 'name="Pieza" value="off"'; } ?>>
            </div>
            <div id="tr" style="display:none;" align="center"><img src="img/ajax-loaders/ajax-loader-1.gif" />
            </div>
            <div id="t"></div>
        </td>
    </tr>
</table>

在trata.php // MySQL + PDO

中

<?php
include('conn.php');
if(isset($_POST['Cara'])) {
    try{
        $Id = $_POST['Id'];
    if ($_POST['Cara'] == false) {
        global $Cara;
        $Cara = 0;
    } else if ($_POST['Cara'] == true) {
        global $Cara;
        $Cara = 1;
    };
        $sql = "UPDATE Trata SET 
        Cara = :Cara
        WHERE Id= :Id";
        $stmt = $conn->prepare($sql);
        $stmt->bindParam(':Cara', $Cara, PDO::PARAM_STR);
        $stmt->bindParam(':Id', $Id, PDO::PARAM_INT);
        $stmt->execute();
        echo "<div class='alert alert-block alert-primary fade in'>
                <button type='button' class='close' data-dismiss='alert' aria-hidden='true'>&times;</button>
                ok.
            </div>";
    }catch(PDOException $exception){ 
        echo "Error: " . $exception->getMessage();
    }
} if(isset($_POST['Pieza'])) {
    try{
        $Id = $_POST['Id'];
    if ($_POST['Pieza'] == false) {
        global $Pieza;
        $Pieza = 0;
    } else if ($_POST['Pieza'] == true) {
        global $Pieza;
        $Pieza = 1;
    };
        $sql = "UPDATE Trata SET 
        Pieza = :Pieza
        WHERE Id= :Id";
        $stmt = $conn->prepare($sql);
        $stmt->bindParam(':Pieza', $Pieza, PDO::PARAM_STR);
        $stmt->bindParam(':Id', $Id, PDO::PARAM_INT);
        $stmt->execute();
        echo "<div class='alert alert-block alert-primary fade in'>
                <button type='button' class='close' data-dismiss='alert' aria-hidden='true'>&times;</button>
                ok.
            </div>";
    }catch(PDOException $exception){ 
        echo "Error: " . $exception->getMessage();
    }
}
$dbh = null;
?>

另一件事是加载ajax只在第一个td显示我，我有8个td文件..

Answer 1

div.feature和div.feature1没有id。这就是$（this）.attr（＆＃39; id＆＃39;）返回undefined的原因。试试这个：

$('div.feature input:checkbox').click(function(){
    var Id = $(this).attr('id');
});

使用javascript和ajax更新多个复选框

1 个答案: