Question

我似乎无法弄清楚为什么这个JQuery没有过滤。我的JQuery函数不正确或是我用来生成错误的错误的PHP。每个生成的Div看起来都是这样

每个生成的Div看起来都是这样

<div class="content" style="background-color: firebrick"> Some Content </div>

这是带有JQuery函数的页面上的代码

<html>
<head>
    <link rel="stylesheet" href="css/logged_in.css">
    <?php   
        include("login_php_scripts.php");
    ?>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
<script>
    $('#filter').keyup(function () { 
        var filter = $("#filter").val();
        $('#warnings').each(function() {
            $(this).find("div:not(:contains('" + filter + "'))").hide();
            $(this).find("div:contains('" + filter + "')").show();
        });
    });
</script>
</head>
<body>

<div id="dialogoverlay"></div>
<div id="dialogbox">
  <div>
    <div id="dialogboxhead"></div>
    <div id="dialogboxbody"></div>
    <div id="dialogboxfoot"></div>
  </div>
</div>

<div id="navigation">
    <a href="index.php?logout">Account</a> 
    <a href="index.php?logout">Logout</a>
</div>

<div id="header">
    <div id="logo"></div>
    <div id="header_text"></div>
</div>

<div id="content_wrapper">
    <div id="list_view">
        <input id = "filter" class = "filter" type = "text" name = "filter" placeholder = "Search. . ."/>
        <div id = "warnings">
            <?php 
                getwarnings();
            ?>
        </div>
    </div>

    <div id="map">
        <script> 
            createmap();
        </script>
    </div>
</div>
<div id="footer"></div>
</body>
</html>

Answer 1

因为您要在文档的头部加载脚本，所以需要使用文档就绪处理程序将其包围起来。

$(document).ready(function){
    $('#filter').keyup(function () { 
        var filter = $("#filter").val();
        $('#warnings').each(function() {
            $(this).find("div:not(:contains('" + filter + "'))").hide();
            $(this).find("div:contains('" + filter + "')").show();
        });
    });
})

有些人，包括我自己，就像这个处理程序的速记风格一样：

$(function(){
    // your code here
});

以下是.ready()事件处理程序的更多内容。

关于php生成Div的Jquery过滤器

1 个答案: