Question

我担心已经问过非常相似的问题here，但由于某种原因，它只是输出“null”。

我正在尝试通过id从ajax输出中找到div html。下面是我的脚本。

// LOAD NAVIGATION
$.ajax({
  type: 'POST',
  url:  'includes/content/bookingsystem/b_navigation.php',
  data: thisButtonType + '=true&loadNav=date',
  success: function(output) { 

    alert(output); // Outputs correctly two divs #navDay, and #navMonth

    alert($(output).find('#navDay').html()); // Results into "null"

    $('#navDay').html($(output).find('#navDay').html()); // Results in an empty div, since it overwrote the html with 'null' - nothing.

    //$('#navDay').replaceWith($('#navDay', output)); // Same here - nada.
    //$('#navMonth').html($(output).find('#navMonth').html());

  }

});

第一个警报（输出）结果如下：

<div id="navDay">Im day nav!</div>
<div id="navMonth">Im month nav!</div>

Answer 1

如果您希望能够使用.find()或$(selector, context)，那么您需要将两个div包装在外部div中 - 这些函数只能找到后代节点，而您HTML中有两个兄弟节点，没有真正的父节点。

您可以执行包装服务器端，也可以使用.wrap()。

此外，.html()函数仅返回代码的内部内容，而不是代码本身。

假设（根据您对.replaceWith的使用），您的意图是替换整个元素，而不仅仅是文本，我会选择：

<div>
    <div id="navDay">Im day nav!</div>
    <div id="navMonth">Im month nav!</div>
</div>

此时，您以前的非工作代码中的这一行也会起作用：

$('#navDay').replaceWith($('#navDay', output));

Answer 2

试试这个

// LOAD NAVIGATION
$.ajax({
  type: 'POST',
  url:  'includes/content/bookingsystem/b_navigation.php',
  data: thisButtonType + '=true&loadNav=date',
  success: function(output) { 

    //alert(output); // Outputs correctly two divs #navDay, and #navMonth

    //alert($(output).find('#navDay').html()); // Results into "null"

    $('#navDay').html($('#navDay', $(output).wrap("<div />")).html()); // Results in an empty div, since it overwrote the html with 'null' - nothing.

    //$('#navDay').replaceWith($('#navDay', output)); // Same here - nada.
    //$('#navMonth').html($(output).find('#navMonth').html());

  }

});

jquery从ajax输出中按ID查找div

2 个答案: