Javascript Jquery脚本未启动_Javascript_Jquery_Html

Javascript Jquery脚本未启动

javascript jquery html

Javascript Jquery脚本未启动,javascript,jquery,html,Javascript,Jquery,Html,我不熟悉jquery的用法。我从internet复制了一个使用jquery筛选表行的工作示例。表中包含2列和相应的值。但是，当我按照说明运行使用jquery筛选行的程序时，我无法使用我的查询筛选行。我不知道我的错误在哪里，也不知道jquery是否真的启动了。下面是我在JSP页面的头部部分中包含的代码 <script src="http://ajax.aspnetcdn.com/ajax/jQuery/jquery-1.11.0.min.js"></script><s

我不熟悉jquery的用法。我从internet复制了一个使用jquery筛选表行的工作示例。表中包含2列和相应的值。但是，当我按照说明运行使用jquery筛选行的程序时，我无法使用我的查询筛选行。我不知道我的错误在哪里，也不知道jquery是否真的启动了。下面是我在JSP页面的头部部分中包含的代码

<script src="http://ajax.aspnetcdn.com/ajax/jQuery/jquery-1.11.0.min.js"></script><script type= "text/javascript">
$("#searchInput").keyup(function() {
    var rows = $("#fbody").find("tr").hide();
    var data = this.value.split(" ");
    $.each(data, function(i, v) {
        rows.filter(":contains('" + v + "')").show();
    });
});


$（“#searchInput”）.keyup（函数（）{
变量行=$（“#fbody”）.find（“tr”）.hide（）；
var数据=此.value.split（“”）；
$。每个（数据、功能（i、v）{
rows.filter（“：contains（“+v+”）”）”）.show（）；
});
});

下面是我在JSP页面主体部分中包含的代码，该页面由带有条目的表组成

<body> <input id="searchInput" placeholder="Type To Filter"><br/><table>
<thead>
<tr><th>Column1</th>
<th>Column2</th></tr>
</thead>
<tbody id="fbody">
<tr><td>cat</td><td>one</td></tr>
<tr><td>dog</td><td>two</td></tr>
<tr><td>cat</td><td>three</td></tr>
<tr><td>moose</td><td>four</td>
</tr><tr><td>mouse</td><td>five</td>
</tr><tr><td>dog</td><td>six</td>
</tr></tbody>
</table>
</body>



专栏1
专栏2
凯通
第二条
卡特里
穆塞福
鼠标五
第六条

请指导我。

将您的JQuery代码添加到就绪块中：

$(document).ready(function() {

  // your code

});

在文档完全加载之前，不能引用元素（如

$（'#mydiv'）

）

并更改您的代码，如：

$(document).ready(function() {
  $("#searchInput").keyup(function() {
      var rows = $("#fbody").find("tr");
      $.each(rows, function() {
       $(this).hide();
      });
      var data = $(this).val().split(" ");
      $.each(data, function(i, v) {
        rows.filter(":contains('" + v + "')").show();
      });
  });
});

您的脚本标记不正确，请将其包装在

文档中。准备就绪：
<script type= "text/javascript"> 
$(document).ready(function(){

$("#searchInput").keyup(function() {

var rows = $("#fbody").find("tr").hide(); 
var data = this.value.split(" "); 
$.each(data, function(i, v) { 
rows.filter(":contains('" + v + "')").show(); 

     }); 
 });


});
</script>

如下图所示，需要准备好文件
 $(document).ready(function() {

  // code

});

因此，在您的情况下，代码如下所示
$(document).ready(function() {
  $("#searchInput").keyup(function() {
      var rows = $("#fbody").find("tr");
      $.each(rows, function() {
       $(this).hide();
      });
      var data = $(this).val().split(" ");
      $.each(data, function(i, v) {
        rows.filter(":contains('" + v + "')").show();
      });
  });
});

$（“#fbody”）.find（“tr”）.hide（）不会返回想要的项目，因为函数末尾有hide（）..hide only set css属性以隐藏元素nothingelse@EhsanSajjad谢谢你的帮助。现在，当我包含read.function（）时，它就可以工作了。现在，我想为我的真实web应用程序包含相同的脚本，其中包括一个按钮，该按钮将从MySQl表中获取所有记录，并显示在嵌入表的简单HTML文件中。现在，我希望使用相同的脚本来过滤结果表。但它不起作用。
$(document).ready(function() {
  $("#searchInput").keyup(function() {
      var rows = $("#fbody").find("tr");
      $.each(rows, function() {
       $(this).hide();
      });
      var data = $(this).val().split(" ");
      $.each(data, function(i, v) {
        rows.filter(":contains('" + v + "')").show();
      });
  });
});