Question

我想为多个按钮调用相同的ajax函数请帮我下面给出代码。此代码将生成按钮，当我们点击按钮时，它会打印详细信息...请解决。此代码将在表格中生成按钮。

<head>
<script>
$(document).ready(function()
{
$("#save").click(function()
{
var sel = $("#response").val();
var fudate=$("#fdate").val();
var cmd=$("#cm").val();
 var id=$("#id").val();
 $.ajax(
    {
        type: "POST",
        url: "autosave.php",
        data: {response:sel,fdate:fudate,cm:cmd,id:id},
       success: function(result)
        {
 alert('result');
          $a= $("#ak").html(result);
       }
    });
});
});
</script>
</head>
<body>
<div id="company_details">
<div id="ak"></div>
<table border="1" align="left">
<tr>
<th >Company</th>
<th>Contact Person</th>
<th>Contact Person's No.</th>
<th>HR</th>
<th>HR's No.</th>
<th>Current Vacancies</th>
<th>Response</th>
<th>Follow Up Date</th>
<th>Comment</th>
<th></th>
<th>Edit</th>
</tr>
<?php 
$con=mysql_connect("localhost","root") or die("Error In Connection:-".mysql_error());
mysql_select_db("ttcs",$con) or die("Error In DB Selection:-".mysql_error());
$sql="select * from company_details";
$rs=mysql_query($sql) or die(mysql_error());
while($row=mysql_fetch_array($rs))
{
?>
<tr>
<td>
<input type="text" name="name" value= <?php $e=$row[0];echo $row[1];?>></td>                              
<td><input type="text" name="cp" value= <?php echo $row[7]; ?>></td>
<td><input type="text" name="cpn" value= <?php echo $row[9]; ?>></td>
<td><input type="text" name="hr" value= <?php echo $row[10]; ?>></td>
<td><input type="text" name="hrn" value= <?php echo $row[12]; ?>></td>
<td>
<?php 
$sql2="select * from vacancies where company_id='$e'";
$rs2=mysql_query($sql2);
if($rs2)
{
while($row2=mysql_fetch_array($rs2))
{?>
<textarea  name="cv" value=<?php echo $row2[1];?>></textarea>
<?php }}?>
</td>
<td>
<select name="response" id="response">
<option value="Not interested">Not Interested</option>
<option value="Not responding">Not Responding</option>                                  
<option value="follow up">Follow up</option>
<option value="Interested">Interested</option>
</select></td>
<?php
$sql1="select * from call_details_company where company_id=$row[0]";
$rs1=mysql_query($sql1);
$row1=mysql_fetch_array($rs1);
?>
<input type="date" name="fdate" id="fdate" value=<?php echo $row1[3];?>>              
<input type="text" name="cm" id="cm" value=<?php  echo $row1[5];?>>
<button  id="save" >save</button>
</td>
</tr>
<?php 
}
?>
</body>

Answer 1

元素的ID必须是唯一的，所以在循环中不要使用ID，将按钮的id更改为类值，然后使用input元素的名称来查找tr中的相对元素

$(document).ready(function () {
    $(".save").click(function () {
        var $tr = $(this).closest('tr')
        var sel = $tr.find("select").val();
        var fudate = $tr.find('input[name="fdate"]').val();
        var cmd = $tr.find('input[name="cm"]').val();
        //need to fix this selector #id too, not able to locate it in the given html structure
        var id = $tr.find("#id").val();
        $.ajax({
            type: "POST",
            url: "autosave.php",
            data: {
                response: sel,
                fdate: fudate,
                cm: cmd,
                id: id
            },
            success: function (result) {
                alert('result');
                $a = $("#ak").html(result);
            }
        });
    });
});

Answer 2

像这样使用

<script>
 function ajaxCallDemo() {
    var sel = $("#response").val();
    var $tr = $(this).closest('tr');
    var cmd = $tr.find("input[name='cm']").val();
    var fudate = $tr.find("input[name='fdate']").val();
    var id = $tr.find("#id").val();
    $.ajax({
        type: "POST",
        url: "autosave.php",
        data: {
            response: sel,
            fdate: fudate,
            cm: cmd,
            id: id
        },
        success: function(result) {
            alert('result');
            $a = $("#ak").html(result);
        }
    });
}
$(document).ready(function() {
    $("#save").click(function() {
        ajaxCallDemo();
    });
    $("#save2").click(function() {
        ajaxCallDemo();
    });
});
</script>

如何为多个按钮使用相同的ajax功能

2 个答案: