0

单击后,我正在尝试编辑特定单元格。当我当前单击一个单元格时,它会将所有单元格td变成文本框。我希望只有单击的单元格这样做。如何仅访问单击的单元格?这是我当前的代码:(暂时忽略该.change功能;我还没有修复它。

 $(document).ready(function()
    {
        $(".edit_td").click(function()
        {
            $(this).children(".text").hide();
            $(this).children(".editbox").show();
        }).change(function()
            {
                var id=$(this).parent();
                var field=$("#input_"+ id).val();
                var text=$("#span_" + id).val();
                var dataString = 'id='+ id +'&field='+ field +'&text='+ text;
                //$("#first_"+ID).html('<img src="load.gif" />'); // Loading image

                if(input != text)
                {
                    $.ajax({
                    type: "POST",
                    url: "table_edit_ajax.php",
                    data: dataString,
                    cache: false,
                    success: function(html)
                    {
                        $("#first_"+ID).html(first);
                        $("#last_"+ID).html(last);
                    }
                    });
                }
                else
                {
                    alert('Enter something.');
                }
            });

        // Edit input box click action
        $(".editbox").mouseup(function() 
        {
            return false
        });

        // Outside click action
        $(document).mouseup(function()
        {
            $(".editbox").hide();
            $(".text").show();
        });

    });

这是我的 PHP 代码:

   public function displayTable($table)
{
    //connect to DB
    $con = mysqli_connect(DB_HOST, DB_USER, DB_PASS, DB_NAME);

    echo "<table id='table' border='1'>";   //start an HTML table

    $dbtable = $table;
    $fields =array();
    $result = mysqli_query($con, "SHOW COLUMNS FROM ".$dbtable);

    //fill fields array with fields from table in database
    while ($x = mysqli_fetch_assoc($result))
    {
        $fields[] = $x['Field'];
    }

    $fieldsnum = count($fields);    //number of fields in array

    //create table header from dbtable fields
    foreach ($fields as $f)
    {
        echo "<th>".$f."</th>";
    }

    //create table rows from dbtable rows
    $result = mysqli_query($con, "SELECT * FROM ".$dbtable);

    while ($row = mysqli_fetch_array($result))
    {
        $rowid = $row[$fields[0]];
        echo "<tr class='edit_tr' id='".$rowid."'>";
        foreach ($fields as $f) 
        { 
            echo "<td class='edit_td'><span id='span_".$rowid."' class='text'>".$row[$f]."</span>
            <input type='text' value='".$row[$f]."' class='editbox' id='input_".$rowid."'/> </td>"; 
        }
        $rowid++;
        echo "</tr>";
    }

    echo "</table>";    //close the HTML table

    //close connection
    mysqli_close($con);
}
4

2 回答 2

0

你可以使用this对象。

$(this).find(".text").hide();
$(this).find(".editbox").show();

它将访问当前行而不是td您的所有代码。

于 2013-09-14T20:09:46.667 回答
0

您当前正在告诉 ALLtexteditbox在单击某些内容时分别隐藏和显示。您要做的只是使与您单击的元素相关的元素隐藏和显示。

为此,您将需要按照以下方式做一些事情

$(".edit_tr").click(function() {
    $(this).children(".text").hide();
    $(this).children(".editbox").show();
}) // your normal stuff can go here.

这将只抓取和修改班级的孩子edit_tr并显示/隐藏您想要的项目。

于 2013-09-14T20:10:01.870 回答