Question

jQuery代码：

$(document).ready(function() {
  $('#s-results').load('get_report1.php').show();
  $('#search-btn').click(function(){ showValues(); });
  $(function() {
    $('form').bind('submit', function() { showValues(); return false; });
  });

  function showValues() { 
    $.post('get_report1.php', { name: form.name.value }, 
      function(result) {
        $('#s-results').html(result).show();
      }
    ); 
  }
});

HTML：

<form name = "form">
   <div>Enter name</div>
     <input type="text" name="name" id="fn" />
     <input type="submit" value="Search" id="search-btn" />
   <div>
      <input type="text" id="se2" name="search22">
   </div>
</form>
<div id = "s-results" style="height:50px;">
</div>

到目前为止，脚本运行完美。现在我只想再次从上面的函数中过滤返回的HTML。

为了实现这一点，我尝试了这行代码：

$(result).filter('#se2');

在具有result参数的函数下，但它不起作用。

那么如何过滤返回的HTML代码呢？

Answer 1

您可能需要find()代替filter，因为您需要获取后代，而过滤＆＃34; 将匹配元素集减少到与选择器匹配的元素或传递函数＆＃39; s test ＆＃34;

<强> Live Demo

$(result).find('#se2');

如果在#se中添加了DOM，那么您可以直接使用ID选择器

se = $('#se2');

我做了另一个演示（因为我还在等待你的演示无效）进一步详细说明如何将包含你的html的字符串传递给jQuery函数$()来搜索元素在其中使用find。

<强> Live Demo

html = '<form name = "form"> \
   <div>Enter name</div> \
     <input type="text" name="name" id="fn" /> \
     <input type="submit" value="Search" id="search-btn" /> \
   <div> \
       <input type="text" id="se2" name="search22" value="se2"/> \
   </div> \
</form>\
<div id = "s-results" style="height:50px;"> \
</div> ';

alert($(html).find('#se2').val());

注意您可以使用find filter对{{1}} 无法正常工作进一步检查上述示例中的代码{{3 }}

Answer 2

问题

您已成功将result添加到#s-results：

$('#s-results').html(result).show();

然后尝试从添加的#se2中选择results，但没有成功：

$(result).filter('#se2');

它没有用，因为你没有从第二步中添加的dom中获得它。

实际上，它正在使用相同的result变量创建 新的未附加 dom。

解决方案

要正确选择添加的#se2内容中的result，请尝试以下操作：

$('#s-results').filter('#se2');

或者，正如@zerkms建议的那样，您可以直接通过以下方式选择它：

$('#se2');

这些可能性将起作用，因为现在它引用了附加到dom的内容，它将搜索您在第一步中添加的相同元素。

Answer 3

您可以尝试使用ajax，如下所示：

$(document).ready(function () {
    $('#s-results').load('get_report1.php').show();
    $('#search-btn').click(function () {
        $.ajax({
            type: "POST",
            url: "get_report1.php",
            data: {
                name: $("#fn").val()
            },
            beforeSend: function () {
                //do stuff like show loading image until you get response
            },
            success: function (result) {
                $('#s-results').html(result).show();
            },
            error: function (e) {
                alert("Error in ajax call " + e);
            }
        });
    });
});

注意：每次点击search-btn时，它都会调用get_report1.php文件，并根据您传递的文本框值检索数据库。我假设在ge_report1.php文件中您使用的是tex-box值，如：$_POST['name']，并且您使用MySQL搜索查询来获取数据。

Answer 4

您可以使用JQuery find代替过滤。

$(result).find('#se2');

然后像这样添加你的变量

var your_element = $('#se2');

如何过滤从jQuery返回的数据？

4 个答案:

问题

解决方案