Question

所以，我正在开发一个小型的Web应用程序，我可以将数据输入表单，单击按钮，然后从表单中删除该数据。我希望能够只是单击表中的数据并让它执行类似的功能，即以某种方式使用$ .post发布数据而不是让表单执行此操作。我虽然不知道怎么做。我已经阅读了几篇教程和文章，并且无法复制表单的提交功能。

这是我目前通过form / php做事的方式：

表单模板

<form name="DeleteMarker" action="index.php" target="_self" method="post">
             <fieldset class="Splice">
                <legend>Delete Marker</legend>
                    <label>Employee: </label><select name="DEmployee">
                    <label>Job Name: </label><select name="DJob">
                    <label>Customer Name: </label><select name="DCustomer">
                    <br>
                    <label>Latitude: </label><input name="DLatitude" min="-180" max="180" step="0.00001" required />
                    <label>Longitude: </label><input name="DLongitude" min="-180" max="180" step="0.00001" required />
                    <br>
                    <input type="submit" value="Delete" />
            </fieldset>
        </form>

PHP

if(isset($_POST['DEmployee'])) {
        $sql="DELETE FROM Splices WHERE (Employee='$_POST[DEmployee]' AND Job='$_POST[DJob]' AND Customer='$_POST[DCustomer]' AND Latitude=$_POST[DLatitude] AND Longitude=$_POST[DLongitude])";
        if (!mysql_query($sql,$Splices)) {
            die('Error: ' . mysql_error());
        }

我有一个javascript函数，其中点击表格会显示警告，我只需要弄清楚如何在那里放一个$ .post或$ .ajax语句来复制我已经拥有的表单的功能。

我有错误的javascript：

function deleteRecord(e,j,c,l,ln) {
        confirm("Delete Record ("+e+", "+j+", "+c+", "+l+", "+ln+")?");
        if(confirm){
            $.post("index.php", {DEmployee:e, DJob:j,DCustomer:c,DLatitude:l,DLongitude:ln});;
        }
}

Answer 1

我将假设您使用$ .post表示您正在使用jQuery，即使您没有标记它。幸运的是，jQuery为您完成了所有工作：

$.post("index.php", $("form[name=DeleteMarker]").serialize(), function(data) {
    //Do something with the response here
}).error(function() {
    //Do something in the case of an error here
})

Answer 2

你没有提到jQuery，但$ .post是jQuery上的一个可用方法。如果您正在使用jQuery并将其包含在您的页面中，那就没关系。你可以这样做，

$('form[name=DeleteMarker]').submit(function() {
  var dataString = $(this).serialize();
  $.post("index.php", dataString);
  return false;
});

修改

实际上，您的deleteRecord()函数还有其他错误用法。

confirm()返回一个布尔值（true或false），因此您必须使用此返回值继续您的代码。

if(confirm) {}不是正确的方法，

你必须使用它，

var c = confirm("do you confirm?"); if(c) { //yes it's confirmed. }

或更有用，

if(confirm("do you confirm?")) { //yes it's confirmed. }

你说'网址仍然只是“index.php”'，你怎么看，我不知道但这是正常的，因为该方法不是GET，所以url会不包括发布的数据作为查询字符串。如果它不起作用，可能还有其他一些问题。

修改-2：实际上它们之间没有区别，这里有一个完整的例子，你可以查看你的浏览器javascript开发工具，看看背景上发生了什么。

<?php if(isset($_GET['DEmployee'])) { $sql="DELETE FROM Splices WHERE (Employee='$_POST[DEmployee]' AND Job='$_POST[DJob]' AND Customer='$_POST[DCustomer]' AND Latitude=$_POST[DLatitude] AND Longitude=$_POST[DLongitude])"; if (!mysql_query($sql,$Splices)) { echo "Error: ". mysql_error(); } else { echo "employee deleted"; } } else { //you can add something else here //<div>blablabla</div> //and the form for delete ?> <html> <head> <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script> <script type="text/javascript"> $(document).ready(function() { $("form[name=DeleteMarker]").submit(function() { if(confirm("This will be deleted, are you sure?")) { var dataString = $(this).serialize(); $.get("index.php", dataString , function(data){ alert(data); }); } return false; }); }); </script> </head> <body> <form name="DeleteMarker" method="GET"> <fieldset class="Splice"> <legend>Delete Marker</legend> <label for="DEmployee" >Employee: </label> <select name="DEmployee"> <option value="name1">name1</option> </select> <label for="DJob">Job Name: </label> <select name="DJob"> <option value="job1">job1</option> </select> <label for="DCustomer">Customer Name: </label> <select name="DCustomer"> <option value="cusname1">customer name1</option> </select> <br> <label>Latitude: </label><input name="DLatitude" min="-180" max="180" step="0.00001" required /> <label>Longitude: </label><input name="DLongitude" min="-180" max="180" step="0.00001" required /> <br> <input type="submit" value="Delete" /> </fieldset> </form> </body> </html> <?php } ?>

HTML5表单提交等效$ .post

2 个答案: