preventDefault无法处理发布请求

时间:2018-02-21 10:00:17

标签: php jquery

当我尝试使用带有post方法的表单删除数据时,我遇到了一些问题,我这样做是因为很多人说使用$ _GET方法不够安全。所以我尝试使用这种方法, 我从load.php加载数据

<?php 

session_start();

require_once('../../classes/Config.php');
require_once('../../classes/Database.php');
require_once('../../classes/Query.php');
require_once '../../classes/ErrorHandler.php';
require_once '../../classes/Validator.php';
require_once '../../classes/Token.php';

$connection = new Database($host, $username, $password, $database);
$main = new Query($connection);

$table = 'karyawan';
$selectData = $main->select($table);

while($fetchData = $selectData->fetch_object()){    
        $delete = '<form action="" method="post"><input type="hidden" name="id_karyawan" value="'.$fetchData->id_karyawan.'"><input type="hidden" name="token" value="'.$_SESSION['token'].'"><a><button type="submit" class="btn btn-danger btn-xs" id="delete" onclick="deleteData()">delete</button></a></form>';
        $button = '<td class="text-center">'.$delete.'</td>';   
    echo '<tr>
            <td class="text-center">'.$fetchData->id_karyawan.'</td>
            <td class="text-center">'.$fetchData->nama_karyawan.'</td>
            <td class="text-center">'.$fetchData->alamat_karyawan.'</td>
            <td class="text-center">'.$fetchData->telepon_karyawan.'</td>
            <td class="text-center">'.$fetchData->akses.'</td>
            '.$button.'
        </tr>';
}

$delete我用POST方法设置了一个表单,所以我有一些表单来删除这些数据,这里是我的load.php应该加载的地方,

<div class="table-responsive">
    <table class="table table-hover table-bordered table-condensed bg-success">
        <thead>
            <th class="text-center">ID Karyawan</th>
            <th class="text-center">Nama Karyawan</th>
            <th class="text-center">Alamat Karyawan</th>
            <th class="text-center">Telepon Karyawan</th>
            <th class="text-center">Hak Akses</th>          
            <th class="text-center">Opsi</th>           
        </thead>
        <tbody id="load-data">

        </tbody>            
            <tr>
                <td colspan="5"></td>
                <td class="text-center"><button class="btn btn-info btn-xs" id="showTambah">Tambah</button></td>
            </tr>           
    </table>
<script type="text/javascript" src="karyawan.js"></script>

这是我的jQuery脚本

load();
deleteData();

function load() {
    $('#load-data').load('process/karyawan/load.php');      
}

function deleteData(){  
    $('#delete').click(function(e){
        e.preventDefault();
        alert('testing');
    });
}

当我点击delete按钮功能时,deleteData()并不能正常使用preventDefault()或alert()消息。 有人能给我一些建议吗?

1 个答案:

答案 0 :(得分:0)

从提交按钮中删除deleteData()并在按钮上添加名为btn-delete的课程,然后移除$('#delete').click(function(e){});事件并使用$('.btn-delete').on("click",function(e){});此事件。由于您的内容loadind动态click事件无效,您必须使用以下代码。

$('.btn-delete').on("click",function(e){
    e.preventDefault();
    alert("test")
});