Question

大家好我试图找到接近此的<p>并将其文本输出到同一页面中的另一个div。问题是，当我进行编码并将其输出给用户并发出警告时，它会显示为空白。以下是我的代码：

$(document).ready(function(){
    $('a.lightbox').click(function(e){
        var txt = $(this).closest("#hh-name").text()
        alert(txt);
        $('body').css('overflow-y',' hidden');

        $('<div id="overlay"></div>')
        .css('top', $(document).scrollTop())
        .css('opacity', '0')
        .animate({'opacity': '0.7'}, 'slow')
        .appendTo('body');

        $('<div id= "lightbox"></div>')
        .hide()
        .appendTo('body');

        $('<img>', {
            src: $(this).attr('href'),
            load: function() {
                positionLightboxImage();
            },
            click : function() {
                removeLightbox();
            }
        }).appendTo('#lightbox');
        return false;
    });
});

function positionLightboxImage() {
  var top = ($(window).height() - $('#lightbox').height()) / 2;
  var left = ($(window).width() - $('#lightbox').width()) / 2;
  $('#lightbox')
    .css({
      'top': top + $(document).scrollTop(),
      'left': left,
      'border': '7px solid white',
      'border-radius': '4px'
    })
    .fadeIn();
}

function removeLightbox() {
  $('#overlay, #lightbox')
    .fadeOut('slow', function() {
      $(this).remove();
      $('body').css('overflow-y', 'auto'); // show scrollbars!
    });
}

<a class="lightbox" href="<?php echo $row_searchHH['imageURL']; ?>"><img id="hh-image" src="<?php echo $row_searchHH['imageURL']; ?>" width="90" height="90" style="margin-left:10px" /></a></div></td>
        <td style="word-wrap:break-word; font-size:20px; font-family:'Myriad Pro'; font-weight:500" width="334" height="35"><p id="hh-name"><?php echo $row_searchHH['name']; ?></p>

提前谢谢

Answer 1

你没有选择body元素是你当前编写的代码。

尝试：

    $('<div id= "lightbox" />')
    .hide()
    .appendTo($('body'))

注意创建元素的语法。

您的代码遇到了一些问题。第一个是使用.closest它只是没有做你认为它做的事情。您必须改为使用.siblings。

然后，为了添加实际节点，我采用了不同的方向，认为它更合适：

$('a.lightbox').click(function(e){
    var txt = $(this).siblings("#hh-name").text();
    $('<div id= "lightbox"></div>').appendTo('body');
    $('<p/>').text(txt).appendTo('#lightbox');
  });

您可以看到demo here

Answer 2

试试这个：http://jsfiddle.net/C576s/

使用最近的选择器没有为你返回任何东西（它不寻找兄弟姐妹）。我保留了调试警报，以便您知道将来如何检查这类内容。

$('a.lightbox').click(
function (e)
{
    var $closest = $(this).next("#hh-name");
    alert($closest.length);

    var txt = $closest.text();
    alert(txt);

    $('<div id= "lightbox"></div>').appendTo('body');
    $('<p>' + txt + '</p>').appendTo('#lightbox');
}

）;

在下一个<p id =“hg-name”>中选择文本并将其附加到div </p>

2 个答案: