Jquery - 如何从中选择下一个元素？

Posted 2023-05-09

【中文标题】Jquery - 如何从中选择下一个元素？

【英文标题】：Jquery - How to select the next element from this?

【发布时间】：2012-06-13 17:39:24

【问题描述】：

我正在从数据库中检索 9 个图像缩略图，每个都位于自己的 div 中，如下所示：

<div class="post">

<div class="post_desc"></div>
<div class="post_title"></div>
<a href="#" class="linktopost">**<img src="img/thumb.png" class="thumb-img"/>**</a>
<form>
**<input type="hidden" class="postid" value="'.$post_id.'" />**
</form>

</div>

使用 Jquery，我试图在单击缩略图时发布隐藏输入字段中的值，但我很难正确选择它。输入中的值随 9 个图像中的每一个而变化。

这是我在 Jquery 方面的进展：

$(".thumb-img").click(function()

    $.post("inc/fullpost.php", postid: ##########.val(),
        function(output)
            $("#gotpostid").html(output).show();
        ).fail(function(x,y,z) 
            $("#gotpostid").html(x + "<br />" + y + "<br />" + z)
        );

);

那么如何正确选择与图像缩略图位于同一包含类的输入字段中的值？

【问题讨论】：

是 .cover-img 还是 .thumb-img ？

【参考方案1】：

您可以使用data 代替hidden 元素。删除hidden 元素，然后尝试这样：

标记：

<img src="img/thumb.png" class="thumb-img" data-postid="'.$post_id.'"/>

脚本：

$(".thumb-img").click(function()
    $.post("inc/fullpost.php", postid: $(this).data('postid'),function(output)
            $("#gotpostid").html(output).show();
        ).fail(function(x,y,z) 
            $("#gotpostid").html(x + "<br />" + y + "<br />" + z)
        );
);

【参考方案2】：

试试这个：

$(".thumb-img").click(function()
    var postId = $(this).closest(".post").find(".postid").val();
    $.post("inc/fullpost.php", postid: postId,
        function(output)
            $("#gotpostid").html(output).show();
        ).fail(function(x,y,z) 
            $("#gotpostid").html(x + "<br />" + y + "<br />" + z)
        );

);

【讨论】：

你知道#gotpostid 是什么吗？next() 在这个问题中的意义何在？

你能详细说明你的问题吗？

虽然与问题无关，#gotpostid 是显示 fullpost.php 输出的 div。我发送 postid 并将与该帖子相关的所有数据发回给我。

【参考方案3】：

$(".linktopost").click(
function() var ValueToPost= $(this).next("input").val();

$.post("inc/fullpost.php", postid: ValueToPost,
    function(output)
        $("#gotpostid").attr('type', 'text').val(output);
    ).fail(function(x,y,z) 
        $("#gotpostid").val(x + "<br />" + y + "<br />" + z)
);



);

【参考方案4】：

试试下面的

$(yourImage).parent().find('.postid').get(0)

【参考方案5】：

嗯，我不知道你是否意识到，但实际上你所做的不是选择一个值，而是在#gotpostid 元素中设置值。

选择值的方法如下：

$value = $('#gotpostid').val();

如果你正在设置它，那么：

$('#gotpostid').val($value);