Question

标题可能有点误导，但要说出来是非常困难的。

我一整天都在尝试，即使是stackoverflow的尝试都失败了，所以我必须再次请求帮助。

我正在从MySQL检索文章信息列表并将其显示在表格中。显示后，这些表行可以使用jQuery .click function进行单击，当单击ckeditor（带有display:none;时）从<section></section>打开并隐藏整个表。

我遇到的问题是，当我点击一行时，它应该显示ckeditor中那些特定文章的数据，但无论第一行数据总是出现，即使我点击另一行，我可以指出，这是因为没有id，所以.click函数无法区分它试图显示哪个部分，但我无法弄清楚如何将表连接到部分信息。

这就是我使用foreach检索数据并将其显示在表格中的方式。

<?php
$getInfo = $articleClass->get_all_article_info();

foreach($getInfo as $data)
{
    $article_title        = $data['article_title'];
    $article_content      = substr(htmlentities($data['article_content']),0,50).'...';
    $article_content_full = $data['article_content'];
    $article_uid          = $data['article_uid'];

    echo '
        <tr id="tr_id" class="'.$article_uid.'">
            <td class="marker">
                <i class="fa fa-align-left"></i>
            </td>

            <td class="title">
                '.$article_title.'
            </td>

            <td class="content">
                '.$article_content.'
                </td>
        </tr>

        <section id="post_info_id" style="display:none;">
            <textarea id="editor1">
                <div style="width:468px;">
                    '.$article_content_full.'
                </div>
            </textarea>
        </section>
    ';
}
?>

这是点击功能; jQuery的。

<script type="text/javascript">
$(document).on('click', '#tr_id', function ()
{
    $("#post_info_id").css("display", "block");
    $("#table_id").hide();
});

window.onload = function()
{
    CKEDITOR.replace( 'editor1' );
};
</script>

我知道问题是，当我点击tr时，它无法区分#post_info_id，因为它只检索了大约20行信息，但$post_info_id没有具体信息id与#tr_id匹配，但我不知道我怎么能做到这一点..我已经检索了article_uid，当文章被插入到数据库中时，这是一个递增的数字，并且可以使用它来标记两者#tr_id和#post_info_id但是使用jQuery我不知道如何在我尝试之后完成。

我不想把这个问题作为一个很长的问题，考虑到我写的越多，我得到答案的可能性就越小，但这就是我的尝试。

我尝试将article_uid设置为id，但是我无法检索文章的id，因为它们是随机的，并且我没有具体说明我可以使用.attr('id')连接post_info_id和tr_id

Answer 1

这可以通过使用Jquery next()函数来实现。

您可以将onclick方法更改为：

$(document).on('click', '#tr_id', function ()
{
     $(this).next('section').css("display", "block");
     $("#table_id").hide();
});

所有元素应该始终具有唯一ID，所以这是实现这一目标的方法：

'<section id="post_info_id"'.$counter.' style="display:none;">
     <textarea id="editor'.$counter.'">
         <div style="width:468px;">
             '.$article_content_full.'
         </div>
     </textarea>
 </section>'

然后声明一个变量以保持在循环外的计数：

$counter = 0;

最后，在循环结束时递增计数器：

$counter++;

如何将可点击行连接到从数据库中检索的特定数据部分？

1 个答案: